B/S模式下數據全屏編輯及批量復制粘貼的實現方法

吳志泉

摘要：本文詳細闡述了在B/S模式下如何實現數據的全屏編輯及如何通過復制-粘貼模式實現數據的批量錄入方法。該方法在作者以asp.net為編程語言，以Oracle為后臺數據庫的設計的《水井分層測試系統》中得到具體應用，取得了良好的效果。

關鍵詞：Asp.net；Oracle；全屏編輯；復制-粘貼

1.引言

隨著信息化的不斷深入，企業內部依托局域網，以B/S模式開發的應用系統逐漸成為主流，但多數據應用系統在進行數據編輯時都是逐條進行的，即編輯完一條數據后，按提交按鈕，再繼續編輯下一條。在很多時候用戶在錄入數據時都需要多條錄入一次提交，這樣不僅方便對數據進行檢查，也能提高數據庫的編輯速度，同時用戶還提出要能通過復制-粘貼模式進行數據的編輯。作者通過數據數據回調及隱含域等方法實現了數據的全屏及復制-粘貼模式實現了數據的批量編輯。

2.設計原理

B/S模式的開發人員都知道，通過web模式錄入數據，在進行數據提交時，都要進行網頁的刷新，刷新之后，動態錄入的數據基本上都會被清除掉。雖然現在有了Ajax技術，但其實質仍然是通過局部刷新網頁來提交數據。在刷新后系統設計時生成的控件內的數據通過數據回調仍然顯示在控件上，但動態添加的控件及其里面的數據都會被清除掉。利用隱含域及數據回調技術，在網頁進行刷新時，把動態控件及其里面的內容寫到隱含域中，頁面刷新后再根據隱含域的內容在頁面上進行控件的重畫及把原來的數據寫到重畫后的控件中，然后通過控制光標鍵在控件內的跳轉，來實現類似于Excel方式的全屏編輯。通過javascript的剪貼板讀取函數把里面的數據讀出來，按格式進行拆分，把拆分后的數據填充到頁面數據編輯框控件中。

3.設計思路

3.1全屏編輯

通過添加行按鈕，在頁面上新添加一行或多行數據編輯框，通過javascript函數↑、↓、回車鍵、Ctrl鍵控制光標在編輯框內跳轉，↑跳轉到上一個編輯框，↓跳轉到下一個編輯框，回車鍵跳轉到后一個編輯框，Ctrl跳轉到前一個編輯框。

3.2復制-粘貼

由于復制-粘貼是在客戶端進行的，我們可以用JavaScript的ClipboardData.getData函數來讀取剪貼板內的數據，然后把讀取的數據根據數據編輯框的個數和行數，拆分成數組分別填充到數據編輯框中。

3.3數據提交

由于asp.net在進行數據提交時，只提交系統設計時生成的控件及其內容，動態添加的控件不會被提交，因此在進行數據提交時，先通過javascript把客戶端動態生成的控件及內容寫到設計時生成的隱含控件（隱含域）中，然后再服務器端對隱含域的內容進行解析，再把解析后的結果保存到數據庫中。

4.程序實現方法

復制-粘貼程序片斷

function WriteDatatoTable（curTable，iSource）

{

var iSourceData；

if （iSource==0）

iSourceData = window.clipboardData.getData（'text'）；

if （iSource==1）

iSourceData=document.getElementById（"ClipboardText"）.value；

if （！iSourceData）

{

document.getElementById（"TipLabel"）.innerHTML="沒有符合條件的數據"；

return；

}

else

{

document.getElementById（"TipLabel"）.innerHTML=""；

}

var curArray=iSourceData.split（"＼n"）；

AddTableRow（curTable，curArray.length-1）；

var TableCellCount=curTable.rows.item（0）.cells.length；

var curSubArray=curArray[0].split（"＼t"）；

if （curSubArray.length>TableCellCount-1）

{

document.getElementById（"TipLabel"）.innerHTML="數據列數大于表格列數"；

return；

}

for （var i=0；i

{

var curSubArray=curArray[i].split（"＼t"）；

for （var j=0；j

{

curTable.rows[i+curTable.rows.length-curArray.length+1].cells[j+1].innerHTML=curSubArray[j]；

}

}}

5.結束語

本程序設計方法，已經成功地應用于由作者開發設計的《水井分層測試系統》中，以B/S模式實現了C/S的數據編輯方法。