layui 工具条实现分页

1.页面 
<div id="getShowTable" style="width: 100%; height: auto;clear: both;"></div>
2.js
//请求后台返回页面
function lodPage(page, limit,key) {
        //请求数据
        $.ajax({
            type: "post",
            url: gContextPath + "/wantReturnBid/wantReturnBidList.htm",
            data: {
                "page": page, "limit": limit,"key":key
            },
            dataType: "html",
            success: function (data) {
                $("#getShowTable").html(data);
            }
        });
}
3.请求返回的页面加
//分页工具条
<div id="page_dv" style="text-align: center;"></div>    
//js
 layui.use(['laypage', 'layer'], function () {
        var laypage = layui.laypage
            , layer = layui.layer;
        var current =${page.count};
        //分页
        laypage.render({
            elem: 'page_dv'
            , count: current //数据总数
            , curr: '${page.page}'
            , limit: 10
            , groups: 10
            , layout: ['count', 'prev', 'page', 'next', 'refresh', 'skip']
            , jump: function (obj, first) {
                if (!first) {
                    var key = $(".js_invite_serach_key").val()||"";
                    lodPage(obj.curr, obj.limit,key);
                }
            }
        });

        //回标
        $(document).on("click",".js_return_bid",function(){
            var _th = $(this);
            var _rel = _th.attr("rel");
            window.location.href=gContextPath+"/wantReturnBid/wantReturnBidEdit.htm?planId="+_rel;
        });

    })

猜你喜欢

转载自www.cnblogs.com/tangbang/p/10121081.html