天天看点

laypage 独立控件使用 laypage 不出总页数

  laypage 不出总页数

 使用了独立的laypage 控件发现一直没有总页数和条数

如下图:

laypage 独立控件使用 laypage 不出总页数

加上红色部分即可

                    ,limits:[10,20,30]

                    ,curr:1

                    ,group:5

                    ,layout: ['prev', 'page', 'next','limit','refresh','skip','count']

function initData(){
            var initData=getData(1,10);
            var total=initData.total;
            var dataList=initData.data;
            layui.use('table', function(){
                var laypage = layui.laypage;
                //执行一个laypage实例
                laypage.render({
                    elem: 'test1' //注意,这里的 test1 是 ID,不用加 # 号
                    ,count: total //数据总数,从服务端得到
                    //,limit:10
                    ,limits:[10,20,30]
                    ,curr:1
                    ,group:5
                    ,layout: ['prev', 'page', 'next','limit','refresh','skip','count']
                    ,jump: function(obj, first){
                        //obj包含了当前分页的所有参数,比如:
                        console.log(obj.curr); //得到当前页,以便向服务端请求对应页的数据。
                        console.log(obj.limit); //得到每页显示的条数
                        //首次不执行
                        if(!first){
                            refData(getData(obj.curr,obj.limit).data);
                        }else{
                            refData(dataList);
                        }

                    }
                });
            });
        }
    function refData(dataList){
            //var dataList=dataArraygetData(page,limit).data;
            layui.use('table', function () {
                var table = layui.table;
                //第一个实例
                table.render({
                    elem: '#demo'
                    ,height: 450
                    ,data: dataList
                    ,limit:dataList.length
                    //page:false
                    ,cols: [[ //表头
                        {field: 'pid', title: '编号', width: 80, sort: true, fixed: 'left'}
                        , {field: 'deviceLocation', title: '地点'}
                        , {field: 'errorvalue', title: '报警备注'}
                        , {field: 'reason', title: '说明'}
                        , {field: 'active', title: '状态'}
                        , {field: 'starttime', title: '时间'}
                        , {field: '', title: '编辑', width: 250, sort: true, toolbar:'#toolbarDemo',fixed: 'right'}
                    ]],
                    loading:true,
                    done:function (res, curr, count) {
                        $("[data-field='active']").children().each(function(){
                            if($(this).text()==1){
                                $(this).text("未阅")
                            }else if($(this).text()==0){
                                $(this).text("阅读并处理")
                            }
                        });
                    },
                    parseData:function(res){
                        return {
                            "code" : res.code, //解析接口状态
                            "msg" : res.msg, //解析提示文本
                            "data" : res.data //解析数据列表
                        }
                    }
                });

                //监听单元格编辑
                // table.on('edit(test_table)',
                //     function (obj) {
                //         var value = obj.value //得到修改后的值
                //             ,
                //             data = obj.data //得到所在行所有键值
                //             ,
                //             field = obj.field; //得到字段
                //         layer.msg('[ID: ' + data.id + '] ' + field + ' 字段更改为:' + value);
                //         //updateTable(data.pid,value);
                //         var jsonResult = sensorServer.updateSensorInfo(obj.data);
                //         console.log(jsonResult);
                //     });

                //监听行单击事件(双击事件为:rowDouble)
                // table.on('row(test_table)', function(obj){
                //     var data = obj.data;
                //     layer.alert(JSON.stringify(data), {
                //         title: '当前行数据:'
                //     });
                //
                //     //标注选中样式
                //     obj.tr.addClass('layui-table-click').siblings().removeClass('layui-table-click');
                // });

                //列里的工具栏
                table.on('tool(test_table)',
                    function(obj) {
                        //var checkStatus = table.checkStatus(obj.config.pid);
                        switch (obj.event) {
                            case 'delete':
                                layer.msg('data:'+obj.data.pid);
                                del(obj);
                                break;
                            case 'updateWarningInfo':
                                layer.msg('data:'+obj.data.pid);
                                updateWarningInfo(obj);
                                break;
                        };
                    });
            });
        }