Operating the HTML table like Powerbuilder's DataWindow chapter 0
發想來自我接觸最久的程式語言 Powerbuilder，說真的跳通到其他語言時，會非常懷念它的DataWindow 物件。原因不外乎，它讓資料操作變得很簡單，甚至讓程式設計師變懶了。 但如果開始使用其他語言時，例如現在幾乎都要用網頁來工作，就發現網頁要操作資料真的不是那麼容易，尤其使用AJAX技術時，針對頁面的操作，每個工程師寫出來的方式大相逕庭，閱讀理解就變得重重。 有鑑於此，只好將自己理解datawidnow的部份，將其方法(method)實現到javascript裡面來。 盡力讓畫面表單操作變得簡單一些。 這樣的好處是，使用相同套件，程式碼閱讀起來清爽也易懂，比較容易除錯。 下面簡單介紹一下操作原理，與表格架構，DataWindow會用DW簡稱： 1、原則上一個類DW的架構如下： <div id="objid"> <table width="100"> <tr> <th width="48" cn="field1">欄1標題</th> <th width="18" cn="field2">欄2標題</th> <th width="28" cn="field3">欄3標題</th> </tr> <table> </div> 這是一個標準table外面包著一個div層，而這個div層的id就是這個datawindow的名稱(datawindow name)，一個DW結構(div)裡面只能有一個table存在。 這個結構很重要，因為接下來所有的操作都會參考這個結構的定義。 2、TH屬性的定義： cn ：欄位名稱，必要的，英數字，其值就是代表了這個欄位的column name。 edit ：編輯模式，選擇性，此屬性表示生成的資料可以編輯，其值(編輯模式)有：text / password / date / ddw / lbox。 key ：關鍵欄，選擇性，其值為yes / no，yes=開啟編