bootstrapTable、PageHelper分页

后台用PageHelper做的，后台要返回rows和total

function initSituationTable() {
    //$('#situation_table').bootstrapTable('destroy');
    $('#situation_table').bootstrapTable({
        url: "../mySysTest/getTestSituationTable",
        striped: true, // 是否显示行间隔色(斑马线)
        method: 'post',//post请求需要配置contentType，默认是get请求不需要配置
        pagination: true, // 是否显示分页（*）
        sidePagination: "server", // 分页方式：client客户端分页，server服务端分页（*）
        paginationLoop: true, // 当前页是边界时是否可以继续按
        queryParams: function (params) {
            console.log(params);
            var temp = {
                pageNum: params.offset/params.limit + 1,
                pageSize: params.limit,
            };
            console.log(temp);
            return JSON.stringify(temp);
        },
        paginationShowPageGo: true,
        showJumpto: true,
        pageNumber: 1, // 初始化加载第一页，默认第一页
        pageSize: 10, // 每页的记录行数（*）
        pageList: [10,20,30], // 可供选择的每页的行数（*）
        contentType: "application/json; charset=utf-8",// 一种编码。在post请求的时候需要用到。这里用的get请求，注释掉这句话也能拿到数据
        dataType: 'json',
        minimumCountColumns: 2, // 最少允许的列数
        clickToSelect: true, // 是否启用点击选中行
        height: 650,//行高，如果没有设置height属性，表格自动根据记录条数觉得表格高度
        uniqueId: "id", // treeNodeId assetsId每一行的唯一标识，一般为主键列
        //showToggle : false, // 是否显示详细视图和列表视图的切换按钮
        //cardView : false, // 是否显示详细视图
        //detailView : false, // 是否显示父子表
        cache: true, // 设置为 false 禁用 AJAX
        sortable: true, // 是否启用排序
        sortOrder: "desc", // 排序方式
        sortName: 'editTime', // 要排序的字段
        columns: [
            {
                field: 'number',
                title: '序号',
                align: 'center',
                valign: 'middle',
                width: '5%',
                formatter: function (value, row, index) {
                    var pageSize = $('#situation_table').bootstrapTable('getOptions').pageSize;//通过表的#id 可以得到每页多少条
                    var pageNumber = $('#situation_table').bootstrapTable('getOptions').pageNumber;//通过表的#id 可以得到当前第几页
                    return pageSize * (pageNumber - 1) + index + 1;//返回每条的序号： 每页条数 * （当前页 - 1 ）+ 序号
                }
            },
            {
                field: 'id',
                title: '申请表id',
                visible: false
            }, {
                field: 'sysName',
                title: '系统名称',
                align: 'center',
                valign: 'middle',
                width: '25%'
            }, {
                field: 'appraisalStateId',
                title: '状态',
                align: 'center',
                valign: 'middle',
                width: '20%',
                formatter: function (value) {
                    if (value == 1) {
                        return "未提交";
                    } else {
                        return " ";
                    }
                }
            }, {
                field: 'appraisalStateId',
                title: '进度',
                align: 'center',
                valign: 'middle',
                width: '20%',
                events: operateEvents,
                formatter: progressPercent,
            }, {
                title: '操作',
                align: 'center',
                valign: 'middle',
                width: '30%',
                events: operateEvents,
                formatter: addFunctionAlty,
            }],
        responseHandler: function (res) {
            return {
                    total: res.total,
                    rows: tableData
            };
        },
        onLoadSuccess: function (result) {
            //加载成功执行
            //toastr.info('数据获取成功');
        },
        onLoadError: function () {
            //加载失败执行
            //toastr.error('数据获取失败');
        },
        onClickRow: function (row, $element) {//bootstrapTable行点击事件
            //点击某行时执行
        },
        formatNoMatches: function () {
            return '未找到与您相关的记录!';
        }
    });
}
```*

最后

以上就是忐忑睫毛膏为你收集整理的bootstrapTable、PageHelper分页的全部内容，希望文章能够帮你解决bootstrapTable、PageHelper分页所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。