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表格分页记录勾选的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持毛票票。