spring mvc ajax請求form表單轉換成json
在使用jquery傳送ajax請求的時候,通過jquery的serialize()方法對錶單進行處理髮送到服務端是比較方便的。
有一種場景是,欄位大部分在form表單下,個別欄位需要組裝,
如果需要組裝的欄位比較簡單,可以使用serializeArray()將form序列化成array之後通過objList.push({name:"id",value:"999"})的方式新增,
相當於新增了一個<input name="id" value="99"> 的表單元素。
如果是複雜的物件,這麼拼接會出現以下問題。
1、從Chrome裡面檢視物件是一個object,name和value分別對應form表單裡面元素的name和value。
2、當頁面向伺服器傳送請求的時候,檢視傳送的請求,欄位值顯示[object Object]
3、接著問題就來了,後臺提示接收到的引數 businessArea失敗,仔細看一下發送的form表單
仔細看,就是這麼傳過去了。。。這就想起來,以前表單裡面新增List型別的物件的時候,html的name標籤經常就是user[0].id user[1].id 以這種方式組裝的。
現在看這種方法行不通。
4、如果自己拼接form表單感覺太麻煩,比較方便的解決方案還是有的,我們可以改成application/json的形式提交,首先要將form表單序列化成json物件,方法如下
$.fn.serializeObject= function() { var o = {}; var a = this.serializeArray(); $.each(a, function() { if (o[this.name]) { if (!o[this.name].push) { o[this.name] = [o[this.name]]; } o[this.name].push(this.value || ''); } else { o[this.name] = this.value || ''; } }); return o; };
使用$("form").serializeObject()方法後form表單內的元素就可以序列化成json物件傳送給後臺。
這時如果我們需要對form表單新增引數,直接 data["name"] = addedObj 即可。
同時ajax新增請求引數contentType:'application/json',
5、服務端開發框架是 spring boot,在直接接收form表單時是不需要@RequestBody標籤的,
當請求頭改為 Accept:application/json後,服務端需要打上@RequestBody標籤。
自此問題解決。
參考了一篇spring mvc 接收引數的文章