记录手动处理form表单中对table表格中的行数据的收集

通过ajax发送数据到controller来处理，这是大部分web应用都会遇到的问题。而对于form表单数据的收集，如果要发送数据少的话，我们可以一个一个来收集，而如果有很多也就是说批量操作那么我们可以通过

$("#FormId").serializeArray()；来自动发送数据，而对于要收集的对象属性名都是相同的，而在controller层的注解通过普通的

@RequestMapping()来完成即可。

例如Object 有属性A,B,C,D.则在form表单中存在

对应的三行数据各自都对应了不同的值。

A1,B1,C1,D1

A2,B2,C2,D2

A3,B3,C3,D3

那么在contoller参数接收通过Object obj来自动收集。最终会以一个对象的形式呈现。

A=A1,A2,A3

B=B1,B2,B3

C=C1,C2,C3

D=D1,D2,D3

然后我们通过拆分每一个属性中的值集合分别来处理多个数据。

上述的处理方式只适合与每一个属性都要么都有值，要么都没有值。而如果其中有一行数据中部分属性可以为空，我们可以通过设置默认值来完成。

但是如果没有默认值允许设置，则无法处理了。

这个时候我们也许需要单独去处理每一行数据来构造json对象，最后以数组形式发送给controller，这个时候controller需要通过List<Object> list

的形式来收集数据集合：

具体的data形式为从表中获取所有需要提交的数据行：

var trList= $("#tableId").find("tr");           var objs=[];           for(var i=4;i<trList.length;i++) {               if($(trList[i]).find("input[name='isSelect']").attr("checked")=='checked'){ //只处理选中的行数据                   var isTrue=0;                   var codes=[];                   var bgType="";                   var fcode="";                   var ss = "";                   var codelist=$(trList[i]).find("td:eq(3)").children();                   for(var j=0;j<codelist.length;j++){                       var codeId=!$(codelist[j]).attr('id')?'0':$(codelist[j]).attr('id');                       if(codeId.length>=4){                           var bgCode=new Object();                           bgCode.fcode=$(codelist[j]).find("select[name='fcode']").val();                           bgCode.bgType=$("#u"+codeId).find("select[name='bgType']").val();                           bgCode.scode='';                           bgCode.tcode='';                           if(bgCode.fcode.charAt(0)=='B') {            bgCode.ss=1;                           }                           if(bgCode.fcode.charAt(0)=='G') {                               bgCode.ss=2;                           }                           codes.push(bgCode);                           bgType=bgType+bgCode.bgType+"#";                           fcode=fcode+bgCode.fcode+"#";                           ss=ss+bgCode.ss+"#";                           isTrue=1                       }                   }                   if(isTrue==0){                       $.messager.alert("操作提示", "关键字信息填写不完整，请补充","error");                       return                   }                   var obj=new Object();                   obj.caseId=$("#caseId").val();                   obj.id=$("#id1").val();                   obj.cid=$("#cid1").val();                   var core=new Object();                    core.bgValueType=$(trList[i]).find("input[name='bType']").val().charAt(0);                    core.bgValue=$(trList[i]).find("input[name='bgValue']").val();                    core.isMan=$(trList[i]).find("input[name='isMan']").val();                    core.custName=$("#custName1").val();                    core.id=$("#id1").val();                    core.bgType=bgType.substring(0,bgType.length-1);                    core.fcode=fcode.substring(0,fcode.length-1);                    core.ss=ss.substring(0,ss.length-1);                    obj.core=core;                    var record=new Object();                    record.isMan = $(trList[i]).find("input[name='isMan']").val();                    record.bType=$(trList[i]).find("input[name='bType']").val();                    record.custName=$("#custName1").val();                    record.id=$("#id1").val();                    obj.record=record;                    obj.codes=codes;                                        objs.push(obj);               }           }           if(objs.length==0) {               $.messager.alert("操作提示", "没有要提交的信息，请选择","error");               return           }                  $.ajax( {              type : 'POST',              url : "${ctx}/path",              data:JSON.stringify(objs),dataType:"json",               headers : {                   'Accept' : 'application/json',                   'Content-Type' : 'application/json'               },              async: false,              success : function(data) {            var message = data.message;            if(message == "success"){               //成功的反馈处理            }else{               if(message == "faild") {                     // 失败的反馈处理            }              }           }); 
其中包含了许多jq选择器的一些操作，可以单独的对每一行处理。

最终的数据集合应该是一个数组集合objs,其中obj是由一些属性和两个对象，一个列表组成的。

其中对象core,record,和list集合codes组成了对象obj.而多个obj组成了list集合的objs在controller层通过list来接收，我们只需要定义obj对象即可，

然后sping就会完成对应的映射。

最后需要注意的时ajax请求发送的单独设置：

data:JSON.stringify(objs)

headers : {                   'Accept' : 'application/json',                   'Content-Type' : 'application/json'               }
这样的设置明确的告诉了spring处理器提交的是json数据。然后就可以了，在上述的数据收集过程中我们可以单独的过滤每行数据。

其实对于jq的操作并不难，就是麻烦的不行。自此记录一下自己的收集过程。方便以后拿过来就用。