一个表单同时保存多条记录（通过ajax保存）

本文主要是介绍一个表单同时保存多条记录（通过ajax保存），希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

        例如上图显示的是一个商品列表，每个列表有两个输入框，可以单个保存，也有批量保存数据。批量保存时，可以通过勾选按钮获取需要保存的对象。

        js代码如下（需要引用jquery.json.min.js）：

var productArray = new Array();
// 校验数据
for(var i = 0;i < ch_goods.length;i++){
    if($(ch_goods[i]).prop("checked")){
    var goods_id = $(ch_goods[i]).val();
     var goods_info_stock = $(ch_goods[i]).parent("td").parent("tr").find("#goods_info_stock").find("input").val();
    var manufacture_time = $(ch_goods[i]).parent("td").parent("tr").find("#manufacture_time").find("input").val();    
    productArray.push({goodsId: goods_id, manufactureTime: manufacture_time, goodsInfoStock: goods_info_stock});
}
}
// 批量保存数据
$.ajax({
               url: "batchSaveThirdGoodStorage.htm",
               type: "POST",
               contentType : 'application/json;charset=utf-8', //设置请求头信息
               dataType:"json",
                //data: JSON.stringify(productArray),    //将Json对象序列化成Json字符串，JSON.stringify()原生态方法
                data: $.toJSON(productArray),  //将Json对象序列化成Json字符串，toJSON()需要引用jquery.json.min.js
                success: function(data){
                       if(data){
                    window.location.reload();
                }else{
                    $(".error_title").html("入库失败，请重新操作！");
                    $("#error-tip").modal('show');
                }
                 },
                 error: function(res){
                      $(".show_title").text("入库失败，请重新操作!");
                      $("#select-tip").modal('show');
                  }
          });

        java后台代码：

这篇关于一个表单同时保存多条记录（通过ajax保存）的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---