bootstrap-paginator中使用ajax

Posted 2020-12-27 arale

// ajax封装
var myAjax = {
    /*data url地址 type 请求方式 */
    ajaxPages: function (url, type, data) {
        $.ajax({
            url: Api + url,
            type: type,
            dataType: "json",
            data: data,
            success: function (data) {
                console.log(data);
                var html = template("tpl-mian", data);
                $("#list").html(html);
                var pageNumber = data.pageNumber;
                var totalPage = data.totalPage;
                pageslist(pageNumber, totalPage);
            }

        })
    }
};
// 分页
function pageslist(pageNumber, totalPage) {
    $(‘#pageUl‘).bootstrapPaginator({
        currentPage: pageNumber,//当前的请求页面。
        totalPages: totalPage,//一共多少页。
        size: "normal",//应该是页眉的大小。
        bootstrapMajorVersion: 3,//bootstrap的版本要求。
        alignment: "right",
        numberOfPages: 5,//一页列出多少数据。
        itemTexts: function (type, page, current) {//如下的代码是将页眉显示的中文显示我们自定义的中文。
            switch (type) {
                case "first": return "首页";
                case "prev": return "上一页";
                case "next": return "下一页";
                case "last": return "末页";
                case "page": return page;
            }
        },
        onPageClicked: function (event, originalEvent, type, page) {
            var pageNumber = page;
　　　　　　  //调用ajax
            myAjax.ajaxPages({ "pageNumber": pageNumber });
        }
    })
}