layui表格分页记录勾选的实例

来源：动视网责编：小采时间：2020-11-27 21:51:22

layui表格分页记录勾选的实例

layui表格分页记录勾选的实例:layui 分页之后没有记录之前勾选项的功能，自己写了一个，主要点就是表格的done 函数，每次渲染完成之后做表格勾选操作。然后需要一个全局变量记录所有已经勾选的项。下面是自己的代码。首先，监听表格的复选框点击事件，将单选或全选全部记录下来

推荐度：

点击下载本文 文档为doc格式

导读layui表格分页记录勾选的实例:layui 分页之后没有记录之前勾选项的功能，自己写了一个，主要点就是表格的done 函数，每次渲染完成之后做表格勾选操作。然后需要一个全局变量记录所有已经勾选的项。下面是自己的代码。首先，监听表格的复选框点击事件，将单选或全选全部记录下来

layui 分页之后没有记录之前勾选项的功能，自己写了一个，主要点就是表格的done 函数，每次渲染完成之后做表格勾选操作。然后需要一个全局变量记录所有已经勾选的项。下面是自己的代码。

首先，监听表格的复选框点击事件，将单选或全选全部记录下来

 var checkArray = new Array();
 // 当前页数据
 var currentArray ;
 //监听行单击事件（单击事件为：rowDouble）
 table.on('checkbox(test)', function(obj){
 var checkData = obj.data ;
 // 如果是全选中
 if(obj.type == 'all' && obj.checked == true){
 var checkStatus = table.checkStatus('demo')
 ,data = checkStatus.data;

 for(var i in data){
 // 如果包含就去掉 ，不包含就添加
 if(checkArray.indexOf(data[i].eventTypeName) > -1){
 }else {
 checkArray.push(data[i].eventTypeName) ;
 }
 }
 }
 // 全不选中
 else if(obj.type == 'all' && obj.checked == false){

 for(var i in currentArray){
 checkArray.remove(currentArray[i].eventTypeName) ;
 }
 }
 // 如果是单选
 else {
 var eventTypeName = checkData.eventTypeName ;
 // 如果包含就去掉 ，不包含就添加
 if(checkArray.indexOf(eventTypeName) > -1){
 checkArray.remove(eventTypeName) ;
 }else {
 checkArray.push(eventTypeName) ;
 }
 }
 });

然后，

done: function(res, curr, count){
 //如果是异步请求数据方式，res即为你接口返回的信息。
 //如果是直接赋值的方式，res即为：{data: [], count: 99} data为当前页数据、count为数据总长度
 currentArray = res.data ;

 //.假设你的表格指定的 id="maintb"，找到框架渲染的表格
 var tbl = $('#demo').next('.layui-table-view');

 // 渲染选择框
 for(var i in currentArray){

 for(var j in checkArray){
 if(currentArray[i].eventTypeName == checkArray[j]){
 tbl.find('table>tbody>tr').eq(i).find('td').eq(0).find('input[type=checkbox]').prop('checked', true);
 }
 }
 }

 form.render('checkbox');
 }

以上这篇layui表格分页记录勾选的实例就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。