layui表格数据复选框回显设置方法
更新时间：2019年09月13日 13:58:38 作者：浪里骚气溅淫花
今天小编就为大家分享一篇layui表格数据复选框回显设置方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
layui2.3版本，本身并不带有复选框回显功能，那么需要从源头解决此事，F12代码调试，找到与复选框关联的地方发现：
我们只需要在渲染数据回调时找到每个复选框根据数据的不同来设置回显。
layui这里有一个坑，设置class属性后会造成二次点击效果，千万不要手动修改class属性，那么应该怎么办呢？
每次**点击**其中一个复选框时都会增加一个class属性，第二次点击又会给删除：
table.render({
elem: '#LAY_table_topic',
url: '/admin/topicHandle/getTopicList',
height: 600,
done:function(result,currPage,count){//数据回调方法
var data = result.data;
data.forEach(function(value, key) {
//这里必须选择点击方法，不知为何添加layui-form-checked class属性会造成二次点击（即下次点击必须点击两下才能生效）bug，
//所有类似的手动修改class貌似都会造成二次效果
if(value.read_total > 10){
$("div[lay-id='topicList'] td .layui-form-checkbox").eq(key).click();
}
})
},
cols: [[
{ type:'checkbox'},
{ field:'id', title: '话题ID', width: 80 },
{ field:'image_url', title: '图片', width: 100 , templet:"#showPic"},
{ field:'content', title: '话题内容', width: 260 },
{ field:'read_total', title: '阅读次数', width: 100 , sort:true},
]],
id: 'topicList',
page: true
});
以上这篇layui表格数据复选框回显设置方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
这篇文章主要介绍了关于JS中涉及的常用类型转换及运算符表达式 ,包括js中常用类型转换，及常用的运算符表达式，需要的朋友可以参考下2017-07-07
实现table排序，网上有很多解决方案，很多都基于jQuery，最后我选择用sortElements，实现很简单2014-05-05
Promise说起来是一个非常简单的概念，即使你没有机会去使用它，很有可能你也了解过它。Promise是一个非常有价值的构造器，能够帮助你避免使用镶套匿名方法，而使用更具有可读性的方式组装异步代码。这里我们将介绍6个最简单的特性，希望对大家有帮助2014-04-04
最近做个项目，需要实现移动端左滑删除功能，当时js代码将网上找的进行删减优化，下面通过本文给大家分享基于JS实现移动端左滑删除功能，感兴趣的朋友一起看看2017-07-07
JavaScript 判断iPhone X Series机型的方法
这篇文章主要介绍了JavaScript 判断iPhone X Series机型的方法，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2019-01-01
这是一个实验用的玩意，它可以克隆指定元素的最终样式，并包装成一个css类，它还可以证明Oprea 11.10 是个混球2011-10-10
这篇文章主要为大家详细介绍了js实现签到日历，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-08-08
js判断输入是否为正整数、浮点数等数字的函数代码，学习js的朋友可以参考下。2010-11-11
这篇文章主要介绍了JavaScript高阶函数，详细讲解了什么是高阶函数和高阶函数的用法，有兴趣的可以了解下2017-06-06
这篇文章主要介绍了javascript实现的字符串转换成数组操作,涉及javascript字符串与数组相互转换、以及数组反转相关操作技巧,需要的朋友可以参考下2019-06-06
最新评论