脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网络编程 → JavaScript → javascript技巧 → layui表格数据复选框回显设置

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表格数据复选框回显设置方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。

您可能感兴趣的文章:

相关文章

  • 从零开始做一个pagination分页组件

    从零开始做一个pagination分页组件

    从零开始做一个pagination分页组件，这篇文章主要介绍了pagination分页组件的制作方法，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2017-03-03
  • 支持ie与FireFox的剪切板操作代码

    支持ie与FireFox的剪切板操作代码

    支持ie与FireFox的剪切板代码，包括读取与写入剪切板的实现代码。
    2009-09-09
  • JavaScript导出CSV文件不完整的问题解决方法

    JavaScript导出CSV文件不完整的问题解决方法

    在JavaScript中处理CSV文件时,需要特别注意一些特殊字符,例如逗号、双引号、换行符等,这些字符可能会影响CSV文件的解析,导致数据错乱,所以本文给大家介绍了如何解决JavaScript导出CSV文件不完整的问题,需要的朋友可以参考下
    2024-06-06
  • JavaScript实现的MD5算法完整实例

    JavaScript实现的MD5算法完整实例

    这篇文章主要介绍了JavaScript实现的MD5算法,以完整实例形式分析了基于JavaScript实现MD5算法的具体步骤与相关技巧,需要的朋友可以参考下
    2016-02-02
  • JS 控制CSS样式表

    JS 控制CSS样式表

    JS控制CSS样式,首先得确定一点,CSS与HTML页面的链接方式,因为CSS有3种与HTML页面结合的方式,不同的方式也会产生不同的结果.
    2009-08-08
  • js获取URL的参数的方法(getQueryString)示例

    js获取URL的参数的方法(getQueryString)示例

    getQueryString方法默认返回的是 string如果是int类型，则JS使用的时候，要进行转换一下，下面有个不错的示例，大家可以参考下
    2013-09-09
  • JS 调用微信扫一扫功能

    JS 调用微信扫一扫功能

    这篇文章主要介绍了JS 调用微信扫一扫功能,本文给大家介绍的非常详细，具有参考借鉴价值，需要的朋友参考下吧
    2016-12-12
  • Ajax实现省市区三级联动实例代码

    Ajax实现省市区三级联动实例代码

    这篇文章介绍了Ajax实现省市区三级联动的方法，文中通过示例代码介绍的非常详细。对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
    2022-04-04
  • js中的面向对象之对象常见创建方法详解

    js中的面向对象之对象常见创建方法详解

    这篇文章主要介绍了js中的面向对象之对象常见创建方法,结合实例形式较为详细的分析了JavaScript创建对象的四种常用方式,需要的朋友可以参考下
    2019-12-12
  • 微信小程序中实现自定义Navbar方法详解

    微信小程序中实现自定义Navbar方法详解

    这篇文章主要介绍了微信小程序中实现自定义Navbar方法,Navbar由 StatusBar和TitleBar组成,只需要知道它们各自的高度,就可以很好地完成自定义,需要的朋友可以参考下
    2024-05-05

最新评论