1. 程式人生 > >表單提交多個物件

表單提交多個物件

需求:將下邊的表單提交,其中一行代表一條記錄

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) {
.....
}