layui table 跨页、翻页记忆选择

2023-11-11

示例:

<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);
                        }
                    }
                }
            }
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

layui table 跨页、翻页记忆选择 的相关文章

随机推荐