【代码片段】BootStrap Table显示行号分页后依然递增

最新推荐文章于 2024-06-18 16:10:07 发布

lovenliu

最新推荐文章于 2024-06-18 16:10:07 发布

阅读量230

点赞数

CC 4.0 BY-SA版权

分类专栏： H5 文章标签： BootStrap

本文链接：https://blog.youkuaiyun.com/lypeng_/article/details/98075298

H5 专栏收录该内容

2 篇文章

订阅专栏

本文介绍了一种在使用Bootstrap Table插件时，如何实现在分页情况下表格序号自增的方法。通过获取当前页码和每页显示数量，计算并显示正确的行号，确保了数据展示的准确性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

首先是常规的行号显示（不会分页后递增）

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

需要分页后递增的，要获取当前分页的页码和每页显示数量，自己计算

columns: [
    {
        title: '序号',
        field: '',
        align: 'center',
        formatter: function (value, row, index) {
            var pageSize = $('#tableId').bootstrapTable('getOptions').pageSize;     //通过table的#id 得到每页多少条
            var pageNumber = $('#tableId').bootstrapTable('getOptions').pageNumber; //通过table的#id 得到当前第几页
            return pageSize * (pageNumber - 1) + index + 1;    // 返回每条的序号： 每页条数 *（当前页 - 1 ）+ 序号
        }
    }
}