Bootstrap-table 显示行号

趁热打铁,使用bootstrap-table时,想要显示每行的行号,再网上查了查,网上给的显示行号的大部分方法,只要一翻页,行号就会又从1开始计算,

也许没有碰到想要的,自己试着解决了这个问题,本人初出茅庐,勿喷!先上图:

 

第一页:

 

第二页:

 

 

.......图大了,下面是js代码:

 

 1  columns: [
 2                     {
 3                         title: '排名',
 4                         align: 'center',
 5                         valign: 'middle',
 6                         formatter:function(value,row,index) {
 7                             // 取得表格的Options
 8                             var options = $("#display-table").bootstrapTable("getOptions");
 9                             // 取得表格的pageSize属性(每页显示的数量)
10                             var pageSize = options.pageSize;
11                             // 取得表格的pageNumber属性(当前页数)
12                             var pageNumber = options.pageNumber;
13                             // 行号的生成方法
14                             return (pageNumber - 1) * pageSize + index + 1;
15                         }
16                     }
17 ]

 

转载于:https://www.cnblogs.com/caizhen/p/9343514.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Python是一种高级编程语言,而Django是一个使用Python编写的Web框架。它们可以一起使用来开发功能强大的Web应用程序。 Bootstrap是一个开源的前端框架,它提供了一套美观和响应式的页面设计元素和样式。它的主要目标是简化开发者在Web上创建美观和易于使用的页面的工作。 Bootstrap-Table是基于Bootstrap框架的一个强大的jQuery表格插件。它提供了丰富的功能和选项,使开发者能够很容易地在Web应用程序中创建和管理数据表格Bootstrap-Table允许开发者使用少量的HTML和JavaScript代码来自定义和配置表格的样式和功能。 在Python Django中使用Bootstrap-Table可以帮助我们更轻松地创建和管理数据表格。我们可以将Bootstrap-Table与Django的模型和视图结合使用,从数据库中获取数据并在Web应用程序中显示它们。通过使用Bootstrap-Table的功能,我们可以对表格进行排序、分页、筛选等操作。 使用Bootstrap-Table的一个例子是在Django的视图中使用它来显示查询结果。我们可以通过在模板中引入Bootstrap-Table的样式和脚本文件,然后在视图中将查询结果传递给模板。在模板中,我们可以使用Bootstrap-Table的数据属性和选项来定义表格的样式和功能。最后,我们可以使用Bootstrap-Table的JavaScript方法来初始化和渲染表格,并在页面上显示查询结果。 总而言之,Python Django与Bootstrap-Table的结合可以让开发者更轻松地创建和管理数据表格,从而为Web应用程序提供更好的用户体验和功能。这是一个强大的组合,可以帮助我们快速开发高效的Web应用程序。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值