今天在使用spring boot自帶的thymeleaf模板時候,想通過form表單傳遞一個自定義數組對象給後端接收。可是一直出現問題,後面經過查閱資料後,發現需要把form表單提交的方式,改成ajax方法提交
這個是form表單部分,通過foreach循環,得到多個實體對象
<code>/<code>
下面是把form提交,改成ajax提交方式,手續愛你通過serializeArray()得到序列化數組,然後在對每一條記錄進行處理。
<code>$(function() {function paperTemplate(uid, question, content){ var paper = new Object(); paper.uid = uid; paper.question = question; paper.content = content; return paper;}$("#submit").click(function() {var paperArray = $('#fm').serializeArray();var paperList = new Array();for(var i = 0; i < paperArray.length / 3; i++) {paperList.push(paperTemplate(paperArray[3*i].value, paperArray[3*i + 1].value, paperArray[3*i + 2].value))} $.ajax({ type: "POST", //提交的方法 url:"http://localhost:8080/test/add", //提交的地址 data:JSON.stringify(paperList),// 序列化表單值 async: false, contentType: "application/json;charset=utf-8",//這個參數也是header參數 error: function(request) { //失敗的話 alert("Connection error"); }, success: function(data) { //成功 alert(data.data); //就將返回的數據顯示出來 } }); });})/<code>
最後,後端代碼為
<code>@ApiOperation(value="新增測試", notes="新增測試")@ResponseBody@PostMapping(value="/add")public String add(@RequestBody Paper [] paperList) {for(Paper paper : paperList) {String uid = paper.getUid();Paper savaPaper = paperService.getById(uid);if (savaPaper != null && paper.getContent() != null) {savaPaper.setContent(paper.getContent());paperService.updateById(savaPaper);}}log.info("提交成功");return ResultUtil.result(SysConf.SUCCESS, "提交成功");}/<code>
最終通過google瀏覽器network能夠看到,提交的數據
最後還需要注意的一個問題就是thymeleaf在進行編譯檢測的時候,會很容易編譯出錯,導致網頁不能正常訪問。通過查閱資料,發現了這句話。
說明:使用springboot的thymeleaf模板時默認會對HTML進行嚴格的檢查,導致當你的標籤沒有閉合時就會通不過。nekohtml這個依賴可以解決這一問題。
1)首先需要引入相關的依賴。
<code> <dependency> <groupid>org.springframework.boot/<groupid> <artifactid>spring-boot-starter-thymeleaf/<artifactid> /<dependency> <dependency> <groupid>net.sourceforge.nekohtml/<groupid> <artifactid>nekohtml/<artifactid> <version>1.9.22/<version> /<dependency> /<code>
2)修改application.yml配置文件
<code>spring: thymeleaf: cache: true #關閉緩存 mode: LEGACYHTML5/<code>
3) 執行mvn clean install 重新打包啟動就可以解決了
閱讀更多 大數據java架構師 的文章