layUi分页表格搭建

layui分页表格搭建

对于数据分页展示需要用到自己的定义的颜色时,可以采用下面的实例
首先导入layui的依赖包



然后再js中写入
layui.use('laypage', function () {
        var laypage = layui.laypage;
        //完整功能
        laypage.render({
            elem: 'thisPage',
            theme: '#1c8cec',
            //后台传过来的总数
            count: tab1Count,
            limit: 6, //行数
            layout: ['prev', 'page', 'next', 'count', 'refresh', 'skip'],  //分页的功能 
            jump: function (obj, first) {
                krt.ajax({   //这个krt是封装的 可以直接采用$
                    type: "POST",
                    url: "${basePath}/hall/hallStaff/index1",
                    async: false,
                    data: {   //搜索条件
                        "start": parseInt(obj.curr - 1) * parseInt(obj.limit),  开始行数
                        "length": 6   长度
                    },
                    success: function (rb) { 
                    	//下面这个时我采用循环遍历的方法将数据填充到表格中
                        let tabObj = $("#tab1");
                        tabObj.html('');
                        let str = '';
                        for (let i = 0; i < rb.data.length; i++) {
                            str += '';
                            str += '' + rb.data[i].names + '' +
                                    '' + rb.data[i].winNum + '' +
                                    '' + rb.data[i].orgNum + '' +
                                    '' + rb.data[i].qyWindowNum + '' +
                                    '' + rb.data[i].yyWindowNum + '' +
                                    '' + rb.data[i].orgNames + '';
                            str += '';
                        }
                        tabObj.append(str);
                    }
                });
            }
        });
    });

你可能感兴趣的:(jquery)