一、Thymeleaf+layui+jquery復(fù)選框回顯

基于Thymeleaf模板下的layui+jquery復(fù)選框回顯，主要是jquery。大致意思是：把數(shù)組轉(zhuǎn)成JSON傳到前臺，再在前臺轉(zhuǎn)回數(shù)組?AJAX一般都是用JSON格式或XML格式來傳遞數(shù)據(jù)的JSON就是一種具有特殊格式的字符串。

1.實體類屬性

1 //顧客等級

2 private Integer[] constomerGradeArray;3 //用來存儲json格式的顧客等級數(shù)組(方便數(shù)據(jù)傳輸)

4 private String constomerGradeString;

View Code

2.后臺返回

@RequestMapping("goodsTypeList")

public String goodsType_list(Client client,Model model){

if(client!=null){

//將數(shù)組轉(zhuǎn)為json格式

client.setConstomerGradeString(JSON.toJSONString(client.getConstomerGradeArray()));

model.addAttribute("client",client);

}

return "goodsType_list";

}

3.前臺頁面

客戶等級

4.jquery

layui.use(['form','jquery'], function(){

var form = layui.form;

var $ = layui.jquery;

$(function () {

if('[[${client.constomerGradeString}]]'!='null'){

//獲取后臺json /*用jQuery處理傳過來的json值*/

var constomerGradeString=$.parseJSON('[[${client.constomerGradeString}]]');

//獲取所有復(fù)選框的值

var constomerGradeArray = $("input[name='constomerGradeArray']");

//遍歷json數(shù)組

$.each(constomerGradeString,function(i,json){

//獲取所有復(fù)選框?qū)ο蟮膙alue屬性，用json數(shù)組和他們匹配，如果有，則說明他應(yīng)被選中

$.each(constomerGradeArray,function(j,checkbox){

//獲取復(fù)選框的value屬性

var checkValue=$(checkbox).val();

if(json==checkValue){

$(checkbox).attr("checked",true);

}

})

//重新渲染(很重要：因為頁面是用layui畫的)

form.render();

})

}

})

})

}

參考鏈接：

json轉(zhuǎn)換：https://www.cnblogs.com/YeHuan/p/11221504.html 或 https://blog.csdn.net/qq_37444478/article/details/76209189

主要代碼：https://blog.csdn.net/w18853851252/article/details/82888109

表單渲染：https://blog.csdn.net/qq_33048333/article/details/80609553

總結(jié)

以上是生活随笔為你收集整理的thymeleaf 复选框回显_Thymeleaf+layui+jquery复选框回显的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。