bootstrap table 显示连续序号,分页有效

参考:http://blog.csdn.net/nazhidao/article/details/51647799

 

第一种,通过index+1可以简单实现,但是,翻页后又重新从第一个开始

{  
    field: 'Number',  
    title: 'Number',  
    formatter: function (value, row, index) {  
    return index+1;  
    }  
} 

第二种,为了能够实现,在翻页时也能后接着上一页的序号显示,下边修改bootstrap 的js库:

在bootstrap-table.js这个js库中找到allowedMethods对象添加一个getPage属性:(红色部分为自己添加,注意逗号)

 var allowedMethods = [
        'getSelections', 'getData',
        'load', 'append', 'remove',
        'updateRow',
        'mergeCells',
        'checkAll', 'uncheckAll',
        'check', 'uncheck',
        'refresh',
        'resetView',
        'destroy',
        'showLoading', 'hideLoading',
        'showColumn', 'hideColumn',
        'filterBy',
        'scrollTo',
        'prevPage', 'nextPage',
        'getPage'
    ];

然后,在js库中,添加方法:

 BootstrapTable.prototype.getPage = function (params) {  
        return {pageSize: this.options.pageSize, pageNumber: this.options.pageNumber};  
}; 

这样就可以在jsp中直接使用了:

 {
                         field:'',
                        title : '序号',
                        formatter : function (value, row, index){
                             var page = $('#task_list').bootstrapTable("getPage");  
                                return page.pageSize * (page.pageNumber - 1) + index + 1;  
                        }
                    },

结果:

posted on 2017-07-17 20:32  世界之大追梦者  阅读(902)  评论(0编辑  收藏  举报

导航