layui table分页后记录选中状态

<div class="list1">
	<table class="layui-table" lay-size="sm" id="list1" lay-filter="list1"></table>
</div>
var ids = [];//选中的数据
var dataArr= [];//当前页面数据
table.render({
	elem: '#list1',
	url: '/admin_8v2gpximtrq.php/system_schedule/getorders',
	totalRow: true,
	cols: [
		[{
				type: 'checkbox',
				fixed: 'left'
			},
			{
				field: 'id',
				title: 'ID',
				width: 60,
				fixed: 'left',
				sort: true,
			}
		]
	],
	page: true,
	response: {
		statusCode: 200 //重新规定成功的状态码为 200,table 组件默认为 0
	},
	parseData: function(res) { //将原始数据解析成 table 组件所规定的数据
		dataArr = res.data.list;
		return {
			"code": res.code, //解析接口状态
			"msg": res.msg, //解析提示文本
			"count": res.data.totalRow, //解析数据长度
			"data": dataArr//解析数据列表
		};
	},
	done: function(res) {
		var len = res.data.length;//当前页面数据长度
		var chooseNum = 0; //记录当前页选中的数据行数
		for (var i = 0; i < res.data.length; i++) {
			for (var j = 0; j < ids.length; j++) {
				if (res.data[i].id == ids[j].id) {
					res.data[i]["LAY_CHECKED"] = 'true';
					var index = res.data[i]['LAY_TABLE_INDEX'];
					//如果你的页面还有第二个表格,就是.list2
					$('.list1 .layui-table-fixed-l tr[data-index=' + index + '] input[type="checkbox"]').prop('checked', true);
					$('.list1 .layui-table-fixed-l tr[data-index=' + index + '] input[type="checkbox"]').next().addClass(
						'layui-form-checked');
					chooseNum++;
				}
			}
		}

		if (len != 0 && chooseNum == len) { //表示该页全选  --  全选按钮样式回显
			$('.list1 input[lay-filter="layTableAllChoose"]').prop('checked', true);
			$('.list1 input[lay-filter="layTableAllChoose"]').next().addClass('layui-form-checked');
		}
	},
});

//监听全选单选,
table.on('checkbox(list1)', function(obj) {
	let checked = obj.checked; //当前选择的状态,是否选中
	if (obj.type == 'all') { //全选
		if (checked) {
			dataArr.forEach(item => {//全部选中,直接向ids push当前选中的数据
				ids.push(item)
			})
		} else {
			dataArr.forEach((item, index) => {//取消全选,循环判断是否相等,相等就删除
				ids.forEach((val, i) => {
					if (item.id == val.id) {
						ids.splice(i, 1)
					}
				})
			})
		}
	} else { //单选
		if (checked) {
			ids.push(obj.data);//选中,直接向ids push当前选中的数据
		} else {
			ids.map((item, index) => {//取消选择,循环判断是否相等,相等就删除
				if (obj.data.id == item.id) {
					ids.splice(index, 1)
				}
			})
		}
	}
});
  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值