1. 程式人生 > >一個表單同時儲存多條記錄(通過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後臺程式碼: