我的jQuery动态表格插件-创新互联

在我的页面处理中有时需要进行表单处理，需要一个用户可以添加修改多条记录。在这里我们需要控制用户的输入验证，表格的添加删除，用户输入数据的统计聚合，还有相应的计算列比如商品的总价=商品的单价*商品数量，再如，同时在用户提交的时候我还要需要获取提交到后台服务端处理在存储到我们的数据库。本插件则简单的处理了这些繁琐的事情。

建网站原本是网站策划师、网络程序员、网页设计师等，应用各种网络程序开发技术和网页设计技术配合操作的协同工作。成都创新互联专业提供成都做网站、网站制作,网页设计,网站制作(企业站、响应式网站建设、电商门户网站)等服务,从网站深度策划、搜索引擎友好度优化到用户体验的提升,我们力求做到极致!

插件属性说明：

1：rowTemplate：这是插入列的模板，在模板中我们的序号这种行号标示的需要rownum 的class。在模板中的需要唯一编号的比如我们的radiobutton的name属性在每个td单元格需要唯一的name组，再如id这种需要唯一的属性，需要{0}的占位符。同时在我们的表格处理中有些行为统计行或者数据的固定行，是不会被用户删除的，则需要fixed=true。以及每个输入或者label等控件，需要回传提取值的需要有property=“propertyname”标示。

2：addTrigger：这是一个触发增加行的jQuery选择器。

3：addPosition：是插入行的插入位置，默认在last最后，但是应我们的需求，可能在最后是汇总行等固定行，所以还添加的三种方式：first，还有就是数值，正数表示从开始行开始计算，负数表示从最后开始计算。

4：removeTrigger：删除标示，它是一个数组，可以有多个删除按钮，同时数组的每个对象也是一个对象有selector触发按钮的jQuery选择器，handler触发的处理方式，取值有first删除第一行,last最后一列,current当前列，所有的删除都是删除非fixed=true的列。

5：同时可以通过$(selector).updateSortNum();替换所有的td 带有rownum的行号列。其实这里我考虑可以去掉td的限制。

6：$（rowselector）.getRowObj():获取以property为属性的javascript行对象。

7:$(tableselector).getTableObj():获取table的以property为属性的javascript数组对象，是行对象的集合（数组）。

8：getSource（saveHiddentField）:获取xml组织的属性集，如果传入了saveHiddentField选择器，这会自动赋值在saveHiddentField上。

这里有item: , root: item为每行数据xml的节点默认item，root为xml根节点默认root。获取了xml，我们就可以在后台直接解析xml，或者是用DataSet.ReadXml()直接转化为DataTable。

8：$(inputselector).getValue():获取控件的值：支持text，label，checkbox，radio，label，td，textarea的取值。其中radio取值选中value，checkbox取值为所有选中行value的“，”号分隔字符串。

9：Calculates：计算汇总，是一个数组对象，具有selector：汇总显示控验证财务的实际支出额不能高于审批额，而审批额不能高于实际的预算额件的选择器，column：汇总的属性，对应我们上面所附加的property属性。func：为汇总处理方式：支持聚合函数:sum,max,min,count,avg,以及用户自定义函数（必须具有返回值），传入参数为一个整列property取值数组Array。

10：CalculatesColumn：计算列，同样是一个js数组，具有trigger数组，表示触发计算的属性property，column计算列的property，func自定义处理函数。（这里废话几句本想用表达式，使用eval处理自动计算，但是觉得需要的变化太多不好控制，所以不如交给用户实现一个函数作为代理委托，作为回调函数）；这里可以用来处理，商品的总价=商品的单价*商品数量，一个上面所说的验证财务的实际支出额不能高于审批额，而审批额不能高于实际的预算额。同时这里也可以作为验证的触发器。

在这个插件中没有数据类型的验证，由于验证的需要变化太大，太多，而且我们一级有了很多优秀的Jquer验证插件，配合使用将用很实用。同时也可以自己控制：比如我的两个简单的验证：

$(".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();
                }
            });

另外有需要云服务器可以了解下创新互联scvps.cn，海内外云服务器15元起步，三天无理由+7*72小时售后在线，公司持有idc许可证，提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案，具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势，专为企业上云打造定制，能够满足用户丰富、多元化的应用场景需求。

本文标题：我的jQuery动态表格插件-创新互联
分享URL：http://dzwzjz.com/article/djiigd.html