2013年5月29日 星期三

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=開啟編輯模式時,如果是修改的情況下,此欄位資料不可以被編輯。
fmt:顯示格式化,選擇性,其值為int / float ,不帶此屬性表示生成的資料為插入資料原始樣式。
ddw:選擇性,當edit="ddw"時,需指定此ddw屬性,畫面輸入方式呈現下拉式選單,而此下拉式選單的資料來源會以其指定的值向 隱藏資料區 取得。而隱藏資料區則是這個資料表單初始化的時候必須先完成,初始化請參考 retrieveDWC 指令。
lbox:選擇性,當edit="lbox"時,需指定此lbox屬性,畫面輸入方式呈現下拉式選單,而此下拉式選單的資料來源會參考其值="'key1':'value1','key2','value2'" 生成。,lbox值內容,以JSON內容列舉,key 或 value前後都必須加上單引號'。
xls:當畫面表格轉換excel檔案時,指定欄位輸出強制excel格式,選擇性,目前僅支援xls="nf@",此格式禁止excel把類數字自動轉數字(一般轉換數字後有0開頭會消失)
pis:轉出資料使用個資遮罩法,選擇性,值為一字串如 "i,5";這個字串由逗號分隔成兩個參數,參數1= i(間格遮)、r(右方遮)、l(左方遮),參數2=遮前保留字元。
※關於個資遮罩的疑惑:公司於內部網路因為內部需要所以有時後會顯示地址、電話等資訊,但是輸出檔案時就必須小心遮蔽重要識別資訊;但若於公司外部網路時,就必須在資料讀取時就預先遮蔽,亦即畫面也無法看到完整的地址、電話等供識別資訊

3、表/裡結構:
這個跟DW行為相同,當資料直接新增時,遇到有參考列舉選項時,雖然畫面呈現的是列舉選項的文字,但是實際上的值卻是選項的 value。

其次,編輯資料時,畫面上雖然是編輯狀態,但是使用者可以取消讓原本的資料復原。


0 個回應: