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=開啟編...