layui表格分页 记录勾选的实例
layui分页之后没有记录之前勾选项的功能,自己写了一个,主要点就是表格的done函数,每次渲染完成之后做表格勾选操作。然后需要一个全局变量记录所有已经勾选的项。下面是自己的代码。
首先,监听表格的复选框点击事件,将单选或全选全部记录下来
varcheckArray=newArray(); //当前页数据 varcurrentArray; //监听行单击事件(单击事件为:rowDouble) table.on('checkbox(test)',function(obj){ varcheckData=obj.data; //如果是全选中 if(obj.type=='all'&&obj.checked==true){ varcheckStatus=table.checkStatus('demo') ,data=checkStatus.data; for(variindata){ //如果包含就去掉,不包含就添加 if(checkArray.indexOf(data[i].eventTypeName)>-1){ }else{ checkArray.push(data[i].eventTypeName); } } } //全不选中 elseif(obj.type=='all'&&obj.checked==false){ for(variincurrentArray){ checkArray.remove(currentArray[i].eventTypeName); } } //如果是单选 else{ vareventTypeName=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",找到框架渲染的表格 vartbl=$('#demo').next('.layui-table-view'); //渲染选择框 for(variincurrentArray){ for(varjincheckArray){ 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表格分页记录勾选的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持毛票票。