关于在layui中的table checkbox 默认选中设置

最新推荐文章于 2024-09-18 17:14:39 发布

转载最新推荐文章于 2024-09-18 17:14:39 发布 · 1.4k 阅读

1 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/mYunYu/p/10220468.html

文章标签：

#javascript #json #ViewUI

本文介绍在layui框架v2.4.5中，如何通过两种方式设置table组件的checkbox默认选中状态。方法一是直接在json数据中设置LAY_CHECKED属性，方法二是自定义checked属性并调整table配置。

一、layui版本

　　layui-v2.4.5

二、设置table的checkbox默认选中

总共有两种方法：

　方法1：在返回的json中设置LAY_CHECKED为true，页面上的checkbox就是选中状态了。

1 data":[
2     {"name":"北京市","areaType":"省/直辖市","id":"110000","LAY_CHECKED":true},
3     {"name":"市辖区","areaType":"地市","id":"110100","LAY_CHECKED":true},
4     {"name":"县","areaType":"地市","id":"110200","LAY_CHECKED":false}
5 ]

方法2：对于方法1，自我觉得写的比较古板，不能自定义key，比如当项目中所返回的数据中没有LAY_CHECKED字段怎么办？为了与其他tree所需字段统一，都将是否选中字段统一定义为checked，比如说返回的是这样的数据：

1 data":[
2     {"name":"北京市","areaType":"省/直辖市","id":"110000","checked":true},
3     {"name":"市辖区","areaType":"地市","id":"110100","checked":true},
4     {"name":"县","areaType":"地市","id":"110200","checked":false}
5 ]

注意：这里用的是checked来标识是否选中，而非LAY_CHECKED。

这时候就需要更改下对table渲染的配置了：

 1 layui.use('table', function(){
 2     var $ = layui.$;
 3     var table = layui.table;
 4     
 5     //在使用table之前加上下面这句就可以了
 6     table =  $.extend(table, {config: {checkName: 'checked'}});
 7     table.render({
 8         ...
 9     });
10 });

转载于:https://www.cnblogs.com/mYunYu/p/10220468.html