在我的頁面處理中有時(shí)需要進(jìn)行表單處理，需要一個(gè)用戶可以添加修改多條記錄。在這里我們需要控制用戶的輸入驗(yàn)證，表格的添加刪除，用戶輸入數(shù)據(jù)的統(tǒng)計(jì)聚合，還有相應(yīng)的計(jì)算列比如商品的總價(jià)=商品的單價(jià)*商品數(shù)量，再如，同時(shí)在用戶提交的時(shí)候我還要需要獲取提交到后臺(tái)服務(wù)端處理在存儲(chǔ)到我們的數(shù)據(jù)庫。本插件則簡單的處理了這些繁瑣的事情。

建網(wǎng)站原本是網(wǎng)站策劃師、網(wǎng)絡(luò)程序員、網(wǎng)頁設(shè)計(jì)師等，應(yīng)用各種網(wǎng)絡(luò)程序開發(fā)技術(shù)和網(wǎng)頁設(shè)計(jì)技術(shù)配合操作的協(xié)同工作。成都創(chuàng)新互聯(lián)專業(yè)提供成都做網(wǎng)站、網(wǎng)站制作,網(wǎng)頁設(shè)計(jì),網(wǎng)站制作(企業(yè)站、響應(yīng)式網(wǎng)站建設(shè)、電商門戶網(wǎng)站)等服務(wù),從網(wǎng)站深度策劃、搜索引擎友好度優(yōu)化到用戶體驗(yàn)的提升,我們力求做到極致!

插件屬性說明：

1：rowTemplate：這是插入列的模板，在模板中我們的序號(hào)這種行號(hào)標(biāo)示的需要rownum 的class。在模板中的需要唯一編號(hào)的比如我們的radiobutton的name屬性在每個(gè)td單元格需要唯一的name組，再如id這種需要唯一的屬性，需要{0}的占位符。同時(shí)在我們的表格處理中有些行為統(tǒng)計(jì)行或者數(shù)據(jù)的固定行，是不會(huì)被用戶刪除的，則需要fixed=true。以及每個(gè)輸入或者label等控件，需要回傳提取值的需要有property=“propertyname”標(biāo)示。

2：addTrigger：這是一個(gè)觸發(fā)增加行的jQuery選擇器。

3：addPosition：是插入行的插入位置，默認(rèn)在last最后，但是應(yīng)我們的需求，可能在最后是匯總行等固定行，所以還添加的三種方式：first，還有就是數(shù)值，正數(shù)表示從開始行開始計(jì)算，負(fù)數(shù)表示從最后開始計(jì)算。

4：removeTrigger：刪除標(biāo)示，它是一個(gè)數(shù)組，可以有多個(gè)刪除按鈕，同時(shí)數(shù)組的每個(gè)對(duì)象也是一個(gè)對(duì)象有selector觸發(fā)按鈕的jQuery選擇器，handler觸發(fā)的處理方式，取值有first刪除第一行,last最后一列,current當(dāng)前列，所有的刪除都是刪除非fixed=true的列。

5：同時(shí)可以通過$(selector).updateSortNum();替換所有的td 帶有rownum的行號(hào)列。其實(shí)這里我考慮可以去掉td的限制。

6：$（rowselector）.getRowObj():獲取以property為屬性的javascript行對(duì)象。

7:$(tableselector).getTableObj():獲取table的以property為屬性的javascript數(shù)組對(duì)象，是行對(duì)象的集合（數(shù)組）。

8：getSource（saveHiddentField）:獲取xml組織的屬性集，如果傳入了saveHiddentField選擇器，這會(huì)自動(dòng)賦值在saveHiddentField上。

這里有item: , root: item為每行數(shù)據(jù)xml的節(jié)點(diǎn)默認(rèn)item，root為xml根節(jié)點(diǎn)默認(rèn)root。獲取了xml，我們就可以在后臺(tái)直接解析xml，或者是用DataSet.ReadXml()直接轉(zhuǎn)化為DataTable。

8：$(inputselector).getValue():獲取控件的值：支持text，label，checkbox，radio，label，td，textarea的取值。其中radio取值選中value，checkbox取值為所有選中行value的“，”號(hào)分隔字符串。

9：Calculates：計(jì)算匯總，是一個(gè)數(shù)組對(duì)象，具有selector：匯總顯示控驗(yàn)證財(cái)務(wù)的實(shí)際支出額不能高于審批額，而審批額不能高于實(shí)際的預(yù)算額件的選擇器，column：匯總的屬性，對(duì)應(yīng)我們上面所附加的property屬性。func：為匯總處理方式：支持聚合函數(shù):sum,max,min,count,avg,以及用戶自定義函數(shù)（必須具有返回值），傳入?yún)?shù)為一個(gè)整列property取值數(shù)組Array。

10：CalculatesColumn：計(jì)算列，同樣是一個(gè)js數(shù)組，具有trigger數(shù)組，表示觸發(fā)計(jì)算的屬性property，column計(jì)算列的property，func自定義處理函數(shù)。（這里廢話幾句本想用表達(dá)式，使用eval處理自動(dòng)計(jì)算，但是覺得需要的變化太多不好控制，所以不如交給用戶實(shí)現(xiàn)一個(gè)函數(shù)作為代理委托，作為回調(diào)函數(shù)）；這里可以用來處理，商品的總價(jià)=商品的單價(jià)*商品數(shù)量，一個(gè)上面所說的驗(yàn)證財(cái)務(wù)的實(shí)際支出額不能高于審批額，而審批額不能高于實(shí)際的預(yù)算額。同時(shí)這里也可以作為驗(yàn)證的觸發(fā)器。

在這個(gè)插件中沒有數(shù)據(jù)類型的驗(yàn)證，由于驗(yàn)證的需要變化太大，太多，而且我們一級(jí)有了很多優(yōu)秀的Jquer驗(yàn)證插件，配合使用將用很實(shí)用。同時(shí)也可以自己控制：比如我的兩個(gè)簡單的驗(yàn)證：

$(".datetime").live("focus", function() {
                WdatePicker({ readOnly: true, dateFmt: 'yyyy年MM月dd日' })//MyDate97
            });

            $(".number").live("keyup", function() {
                this.value = this.value.replace(/[^-\d\.]/g, '');
            }).live("keydown", function(e) {
                if (e.which == 189) {
                    $(this).val(-1 * parseFloat($(this).val())).trigger("change");
                    e.stopPropagation();
                    e.preventDefault();
                }
            });

另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn，海內(nèi)外云服務(wù)器15元起步，三天無理由+7*72小時(shí)售后在線，公司持有idc許可證，提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡單易用、服務(wù)可用性高、性價(jià)比高”等特點(diǎn)與優(yōu)勢(shì)，專為企業(yè)上云打造定制，能夠滿足用戶豐富、多元化的應(yīng)用場(chǎng)景需求。

標(biāo)題名稱：我的jQuery動(dòng)態(tài)表格插件-創(chuàng)新互聯(lián)
標(biāo)題URL：http://weahome.cn/article/djiigd.html