表單提交多個物件
阿新 • • 發佈:2019-02-12
需求:將下邊的表單提交,其中一行代表一條記錄
JS程式碼:遍歷form表單下的tr元素,將每個tr下的select、input元素的name和value封裝到JS物件
orderItemObj中,再放入陣列orderItemArray中
//以tr為單位,一個tr代表一條記錄 var orderItemArray = new Array(); $("#orderItemForm tr").each(function(){ //this代表當前dom物件tr var that = this; var orderItemObj = new Object(); $(that).find("select,input").each(function(){ var name = $(this).attr("name"); orderItemObj[name] = $(this).val(); }); orderItemArray.push(orderItemObj); });
通過ajax提交陣列orderItemArray, JSON.stringify(orderItemArray)將陣列物件解析成json字串
$.ajax({ url: base + "/order/O2OOuter/saveSplitOrderItem", method: "POST", dataType: "json", contentType: "application/json;charset=utf-8", async: false, data: JSON.stringify(orderItemArray), success: function (data) { }, error: function () { });
後臺接收程式碼:用list集合接收json字串,跟用物件接收平常表單的提交資料應該是一個道理。因為http請求的資料都是以字串的形式傳遞的。
@RequestMapping(value = "/saveSplitOrderItem", method = RequestMethod.POST)
@ResponseBody public String saveSplitOrderItem(@RequestBody List<OrderItemInputDTO> orderItemList, BindingResult bindingResult, ModelMap model) {
.....
}