table 的form序列化提交 ,及json 处理list<对象>

部分代码如下:

form如下:

<form id="formMessage"  method="post" enctype="application/x-www-form-urlencoded">

    <table id="menuList" data-mobile-responsive="true" class="table table-hover table-responsive" >

      <thead>
        <tr>

          <th>
            <div class="th-inner "><spring:message code="sid"/></div>
          </th>
          <th>
            <div class="th-inner " style="width: 130px"><spring:message code="orderNumber"/></div>
          </th>
          <th>
            <div class="th-inner "><spring:message code="hawbCode"/></div>
          </th>
          <th>
            <div class="th-inner "><spring:message code="mawbCode"/></div>
          </th>
          <th>
            <div class="th-inner "><spring:message code="pieces"/></div>
          </th>
          
        </tr>
      </thead>
      <tbody id="orderMenuList">

      <c:forEach items="${orderDetailsList}" var="orderDetails" varStatus="i">

        <c:choose>
          <c:when test="${orderDetails.orderInvoiceName == '0'}">
            <tr id="option${i.index + 1}">
          </c:when>
          <c:otherwise>
            <tr id="option${i.index + 1}" bgcolor="#7CCD7C">
          </c:otherwise>
        </c:choose>

        <%--<tr id="option${i.index + 1}">--%><%--<tr id="option${i.index + 1}" bgcolor="#7CCD7C">--%>
          <td>${i.index + 1}<input name="orderInvoiceName"  type="text"  style="border:0;background:transparent;display: none" value="${orderDetails.orderInvoiceName}"/></td>
          <td><input name="orderCode" type="text"  style="border:0;background:transparent;" value="${orderDetails.orderCode}"/></td>
          <td><input name="orderHawbcode" type="text"  style="border:0;background:transparent;" value="${orderDetails.orderHawbcode}"/></td>
          <td><input name="orderMawbcode" type="text"  style="border:0;background:transparent;" value="${orderDetails.orderMawbcode}"/></td>
          <td><input name="orderPieces" type="text"  style="border:0;background:transparent;" value="${orderDetails.orderPieces}"/></td>
          
        </tr>
      </c:forEach>

      </tbody>
    </table>
</form>
js触发事件如下:

function orderMessage(){
    var forms = $("#formMessage").serialize();
    var json = "[{";
    var msg2 = forms.split("&");   //先以“&”符号进行分割,得到一个key=value形式的数组
    var t = false;
    for(var i = 0; i<msg2.length; i++){
      var msg3 = msg2[i].split("=");  //再以“=”进行分割,得到key,value形式的数组
      for(var j = 0; j<msg3.length; j++){
        json+="\""+msg3[j]+"\"";
        if(j+1 != msg3.length){
          json+=":";
        }
        if(t){
          json+="}";
          if(i+1 != msg2.length){  //表示是否到了当前行的最后一列
            json+=",{";
          }
          t=false;
        }
        if(msg3[j] == "orderRemark"){  //这里的“canshu5”是你的表格的最后一列的input标签的name值,表示是否到了当前行的最后一个input
          t = true;
        }
      }
      if(!msg2[i].match("orderRemark")){  //同上
        json+=",";
      }

    }
    json+="]";
    //alert(json);
//decodeURIComponent针对中文序列化乱码处理

    $.ajax({
      url:"/***/***",
      type:"post",
      data:{messageData:decodeURIComponent(json,true)},
      dataType: 'json',
      cache: false,
/*      processData: false,
      contentType: false,*/
      success:function(data){
        alert("操作成功!");

      },
      error:function(e){
        alert("网络错误,请重试!!");
      }
    });
  }
后台处理json,:

String dataMessage = request.getParameter("messageData");

List<对象> list = JSON.parseArray(dataMessage , 对象.class);

猜你喜欢

转载自blog.csdn.net/goodlook0123/article/details/75566149