Thymeleaf+layui+jquery复选框回显
2021-05-01 11:28
标签：ecb ejs item 标签 splay null mod display cli 基于Thymeleaf模板下的layui+jquery复选框回显，主要是jquery。大致意思是：把数组转成JSON传到前台，再在前台转回数组 AJAX一般都是用JSON格式或XML格式来传递数据的JSON就是一种具有特殊格式的字符串。 参考链接： json转换：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 Thymeleaf+layui+jquery复选框回显 标签：ecb ejs item 标签 splay null mod display cli 原文地址：https://www.cnblogs.com/wwct/p/12144257.html一、Thymeleaf+layui+jquery复选框回显
1.实体类属性
1 //顾客等级
2 private Integer[] constomerGradeArray;
3 //用来存储json格式的顾客等级数组(方便数据传输)
4 private String constomerGradeString;
2.后台返回
@RequestMapping("goodsTypeList")
public String goodsType_list(Client client,Model model){
if(client!=null){
//将数组转为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}]]‘);
//获取所有复选框的值
var constomerGradeArray = $("input[name=‘constomerGradeArray‘]");
//遍历json数组
$.each(constomerGradeString,function(i,json){
//获取所有复选框对象的value属性，用json数组和他们匹配，如果有，则说明他应被选中
$.each(constomerGradeArray,function(j,checkbox){
//获取复选框的value属性
var checkValue=$(checkbox).val();
if(json==checkValue){
$(checkbox).attr("checked",true);
}
})
//重新渲染(很重要：因为页面是用layui画的)
form.render();
})
}
})
})
}
上一篇：CSS选择器归类举例
下一篇：js中this的指向