layui table 跨页、翻页记忆选择

示例:

<script>
    let ids  = [[${userIds}]];          //获取后台传过来的list    (这里不用input hidden传递值)
    let tableIds = new Array();    // 保存当前页数据id,当全选的时候会用到
</script>
<table class="layui-table" id="tblInfo" lay-filter="tblInfo"></table>
 layui 需要初始化的:
 form = layui.form,
 layfilter = layui.layfilter;

 table.render({
            elem: '#tblInfo'
            , url: '/user/list'
            , cols: [[
                {type: 'checkbox'}
                , {field: 'phone', width: '20%', title: '手机号码'}
                , {field: 'userId', width: '15%', title: '编号'}
                , {field: 'nickname', title: '昵称'}
            ]]
            , done: function (res, curr, count) {


                // 当前页数据id到全局变量, 当全选的时候会用到
                tableIds = res.data.map(function (value) {
                    return value.id;
                });

                // 回显
                $.each(res.data, function (idx, val) {
                    if (ids.indexOf(val.id) > -1) {
                        $('div.layui-unselect.layui-form-checkbox')[idx+1].click();
                        form.render('checkbox'); //刷新checkbox选择框渲染
                    }
                });
            }

            , id: 'tblInfo'
            , limit: 10//每页显示的记录数量
            , limits: [200]//可选择每页显示的数量
            , page: true

});

// 监听勾选事件

 table.on('checkbox(tblInfo)', function (obj) {
            if (obj.checked == true) {
                if (obj.type == 'one') {
                      //排重
                    if (ids.indexOf(obj.data.id) == -1) {
                        ids.push(obj.data.id);
                    }
                } else {
                    for (let i = 0; i < tableIds.length; i++) {
                        //排重
                        if (ids.indexOf(tableIds[i]) == -1) {
                            ids.push(tableIds[i]);
                        }
                    }
                }
            } else {
                if (obj.type == 'one') {
                    let i = ids.length;
                    while (i--) {
                        if (ids[i] == obj.data.id) {
                            ids.splice(i, 1);
                        }
                    }
                } else {
                    let i = ids.length;
                    while (i--) {
                        if (tableIds.indexOf(ids[i]) != -1) {
                            ids.splice(i, 1);
                        }
                    }
                }
            }
});
  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值