layui中checkbox换页不能获取之前选中的数据

前台页面

 

<div class="yys-fluid yys-wrapper"> <div class="layui-row lay-col-space20"> <div class="layui-cos-xs12 layui-col-sm12 layui-col-md12 layui-col-lg12"> <section class="yys-body animated rotateInDownLeft"> <div class="yys-body-content clearfix changepwd"> <div class="layui-col-lg12 layui-col-md10 layui-col-sm12 layui-col-xs12" style="width:100%"> <div class="user-tables"> <table id="userTables" lay-filter="userTables"> </table> </div> </div> </div> </section> </div> </div> </div> </div>

js内容

<script>
    var $ = null;
    layui.use(["jquery", "upload", "form", "table", "layer", "element", "laydate"], function () {
        $ = layui.jquery;
        var element = layui.element,
            layer = layui.layer,
            upload = layui.upload,
            form = layui.form,
            laydate = layui.laydate,
            table = layui.table;
        //记录选中的数据:做缓存使用,作为参数传递给后台,然后生成pdf ,压缩
        var ids =new Array();
        //当前表格中的全部数据:在表格的checkbox全选的时候没有得到数据, 因此用全局存放变量
        var table_data=new Array();
      
　　　　  var a = table.render({
            elem: "#userTables",
            skin: 'line', //行边框风格
            cols: [[
                {checkbox: true, width: 60, fixed: true},
                {type: 'numbers', title: '序号', width: '40'},
                {
                    field: "name",
                    width: 80,
                    title: "姓名",
                    align: "left"
                }, {
                    field: "phone",
                    width: 120,
                    title: "电话",
                    align: "left"
                }, {
                    field: "identificationNuber",
                    width: 170,
                    title: "身份证号码",
                    align: "left"
                }, {
                    field: "updateTime",
                    width: 140,
                    title: "更新时间",
                    align: "left",
                    templet: '#TimeTpl'
                }, {
                    title: "常用操作",
                    width: 200,
                    align: "left",
                    toolbar: "#userbar",
                    fixed: "right"
                }]],
            url: "/user/getReportList",
//            data: userData,
            page: { //分页设定
                layout: ['count', 'prev', 'page', 'next'] //自定义分页布局
                , curr: 1 //设定初始在第 1 页
                , limit: 10//每页多少数据
                , groups: 5 //只显示 5 个连续页码
            },
            even: true
            ,done: function(res, curr, count){
                //数据表格加载完成时调用此函数
                //如果是异步请求数据方式，res即为你接口返回的信息。
                //如果是直接赋值的方式，res即为：{data: [], count: 99} data为当前页数据、count为数据总长度

                    //设置全部数据到全局变量
                    table_data=res.data;
 
                    //在缓存中找到id ,然后设置data表格中的选中状态
                    //循环所有数据，找出对应关系，设置checkbox选中状态
                    for(var i=0;i< res.data.length;i++){
                        for (var j = 0; j < ids.length; j++) {
                            //数据id和要勾选的id相同时checkbox选中
                            if(res.data[i].id == ids[j])
                            {
                                //这里才是真正的有效勾选
                                res.data[i]["LAY_CHECKED"]='true';
                                //找到对应数据改变勾选样式，呈现出选中效果
                                var index= res.data[i]['LAY_TABLE_INDEX'];
                                $('.layui-table-fixed-l tr[data-index=' + index + '] input[type="checkbox"]').prop('checked', true);
                                $('.layui-table-fixed-l tr[data-index=' + index + '] input[type="checkbox"]').next().addClass('layui-form-checked');
                            }
                        }
                    }
                    //设置全选checkbox的选中状态，只有改变LAY_CHECKED的值， table.checkStatus才能抓取到选中的状态
                    var checkStatus = table.checkStatus('my-table');
                    if(checkStatus.isAll){
                        $(' .layui-table-header th[data-field="0"] input[type="checkbox"]').prop('checked', true);
                        $('.layui-table-header th[data-field="0"] input[type="checkbox"]').next().addClass('layui-form-checked');
                    }
                //得到所有数据
                console.log(res);
                //得到当前页码
                console.log(curr);
                //得到数据总量
                console.log(count);
            }
        });

        //复选框选中监听,将选中的id 设置到缓存数组,或者删除缓存数组
        table.on('checkbox(userTables)', function (obj) {
           if(obj.checked==true){
               if(obj.type=='one'){
                   ids.push(obj.data.id);
              }else{
                   for(var i=0;i<table_data.length;i++){
                       ids.push(table_data[i].id);
                   }
               }
           }else{
               if(obj.type=='one'){
                   for(var i=0;i<ids.length;i++){
                      if(ids[i]==obj.data.id){
                           ids.remove(i);
                       }
                  }
               }else{
                   for(var i=0;i<ids.length;i++){
                       for(var j=0;j<table_data.length;j++){
                           if(ids[i]==table_data[j].id){
                              ids.remove(i);
                          }
                       }
                   }
               }
           }
        });

        //搜索加载--数据表格重载
        var $ = layui.$, active = {
            reload: function () {
                //执行重载
                table.reload('userTables', {
                    page: {
                        curr: 1 //重新从第 1 页开始
                    }
                    , where: {
                       searContent: $("input[name=searContent]").val()
                    }
                });
            }
        };


        $('#searchEmailCompany').on('click', function () {
            ids=new Array();
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });
        element.init();
    });

//删除数组自定义函数
    Array.prototype.remove=function(dx)
    {
        if(isNaN(dx)||dx>this.length){return false;}
        for(var i=0,n=0;i<this.length;i++)
        {
            if(this[i]!=this[dx])
            {
                this[n++]=this[i]
            }
        }
        this.length-=1
    }
</script>

 

 

注意：userTables缓存函数里面的参数是页面表格的id