layui+php后端分页优化数据

  //监听查询
        form.on('submit(formDemo)', function (data1) {
            $.post('链接'
                , {'data': 数据}
                , function (data2) {
                    if (data2.status == 1) {
                        //判断是否有数据                   
                            setData("#demo", data2.data.list);//点击查询调用table渲染
                            //分页
                            laypage.render({
                                elem: 'page' //分页容器的id
                                , count: data2.data.list.count //数据总数
                                , limit: data2.data.list.limit //每页显示的数据条数
                                , theme: '#a1d8ef' //自定义选中色值
                                , layout: ['prev', 'page', 'next', 'count', 'limit', 'refresh', 'skip'] //自定义排版
                                , jump: function (obj, first) {//回调函数  用来接受点击分页的值
                                    if (!first) {//判断不是第一页
                                        $.post('链接'
                                            , {'data': JSON.stringify(data1.field), curr: obj.curr, limit: obj.limit}
                                            , function (data3) {
                                                setData("#demo", data3.data.list);//点击分页调用table渲染
                                            }, 'json')
                                    }
                                }
                            });

                        } else {
                            notify.info('暂无查询数据');
                          
                        }

                    } else {
                        notify.info(data2.message);//错误提示
                    }
                }, 'json'
            )


        });







   //渲染动态表格
    function setData(Id, data) {
        let table = layui.table;//获取表格
        let col = [[]];//二维数组
        let zd = data.zd;//获取字段名变成数组
        for (let i = 0; i < zd.length; ++i) {//动态添加列属性
            col[0].push({field: zd[i], title: zd[i]});//存二维数组 , sort: true
        }

        table.render({//渲染表格
            elem: Id  //table的id属性
            , data: data.all  //后台获取的数据
            , loading: true //加载延迟
            , height: 450 //表格的高度
            , cols: col//把二维数组给cols
        })
    };

 

 

 

 

  • 2
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值