Bootstrap-table 服务端分页无效以及服务端分页后不显示页码的解决方法
![]() | ![]() | ![]() | ![]() |
| 【性价之王】 | 【线路之王】 | 【价格之王】 | 【配置之王】 |
| 【免费之王】 | 【香港首推】 | 【梯子之王】 | 【独服之王】 |

Bootstrap-table 是一款由国人开发的功能非常非常强大的表格插件,强烈推荐各位小伙伴们使用,最近在使用 Bootstrap-table 过程中发现分页方式设置为服务端后无法加载数据以及正确分页了,经过阅读文档发现,Bootstrap-table 客户端分页和服务端分页模式要求返回的数据格式是不一样的。
客户端分页模式只要返回 json 格式的数据数组即可,而服务端分页的时候除了要返回数据数组以外还要返回 total,即总记录数。
客户端分页方式返回数据格式:
[{"id":20170004,"name":"测试活动系部","description":"所属系部活动","begin_time":1501516800,"end_time":1504281600,"create_time":0,"score":0.1,"level":"系级","type_id":"创新创业","department_id":2,"sid":17160100,"aid":20170004,"time":1504751546},{"id":20170002,"name":"学院军训","description":"学院 2017 年军训,大学生志愿者。","begin_time":1504195200,"end_time":1504281600,"create_time":0,"score":0.2,"level":"校级","type_id":"社会实践","department_id":1,"sid":17160100,"aid":20170002,"time":1504676795},{"id":20170001,"name":"学院迎新","description":"学院 2017 年迎新活动,大学生志愿者。","begin_time":1504195200,"end_time":1504281600,"create_time":0,"score":0.5,"level":"校级","type_id":"工作履历","department_id":1,"sid":17160100,"aid":20170001,"time":1504751546}]服务端分页方式返回数据格式:
{"total":4,"rows":[{"id":20170001,"name":"学院迎新","description":"学院 2017 年迎新活动,大学生志愿者。","begin_time":1504195200,"end_time":1504281600,"create_time":0,"score":0.5,"level":"校级","type_id":"工作履历","department_id":1,"sids":"","count":0},{"id":20170002,"name":"学院军训","description":"学院 2017 年军训,大学生志愿者。","begin_time":1504195200,"end_time":1504281600,"create_time":0,"score":0.2,"level":"校级","type_id":"社会实践","department_id":1,"sids":"","count":0},{"id":20170003,"name":"测试活动已过期","description":"已过期活动","begin_time":1504195200,"end_time":1504972800,"create_time":0,"score":0.2,"level":"校级","type_id":"志愿公益","department_id":1,"sids":"","count":0},{"id":20170004,"name":"测试活动系部","description":"所属系部活动","begin_time":1501516800,"end_time":1504281600,"create_time":0,"score":0.1,"level":"系级","type_id":"创新创业","department_id":2,"sids":"","count":0}]}加上 total 后服务端分页模式正常加载了数据,但是却无法正常加载页码,原因是我获 total 的时候是直接使用 count 方法获取了单次查询的结果数组的记录数,而实际上 total 应该是全部符合条件的记录数。改正 total 之后页码显示正常,到此 Bootstrap-table 服务端分页无效以及服务端分页后不显示页码的问题解决。
猜你可能想看的VPS
- tudcloud 新年优惠全站 VPS 年付 7 折全球[VPS测评]
- CentOS6 服务器 LAMP 配置 怎么在 CentOS6 上安装 全球[VPS测评]
- Kdatacenter→韩国 KVM-1GB 100GB SSD 500韩国VPS[主机]
- SmartHost→$6.95 月 KVM-8GB 40GB 2TB 洛全球[VPS测评]
- 任务管理器中的进程上下跳动 进程列表总是变无法选中怎么办?全球[VPS测评]
- 真实测评 virmach 年付黑五 4.75 刀 512M 内存 10G全球[VPS测评]
- 右键菜单没有新建选项怎么办?全球[VPS测评]
- BudgetVM→$12.5 月 KVM-2GB 5GB 100M 不限日本VPS[主机]
- 腾讯云拼团→单核 2G 内存 50G 硬盘 1M 带宽月付 15 元 买全球[VPS测评]
- 优惠 CloudCone 新年促销→年付$20 1 核 512M 内存 全球[VPS测评]
- 菠萝云→99 元 月 4 核 4GB 内存 100GB SSD 空间 不虚拟空间(主机)
- WordPress一键重新生成全站缩略图插件:Regenerate Th全球[VPS测评]
- WordPress博客使用php页面代码实现外链go跳转的方法全球[VPS测评]
- 腾讯云岁末回馈老用户免费体验CDN,轻量应用服务器或者云存储一个月全球[VPS测评]
- HKServerSolution → 4G内存 50G SSD 100M全球[VPS测评]
- ZeptoVM 1G内存 10G SSD 1T双向流量 50M国际带宽 全球[VPS测评]
- 2023年 IDC市场结构和方向的深度分析全球[VPS测评]
- 从阿里云七代云服务器,谈云计算四大趋势全球[VPS测评]
- 桔子数据怎么样?便宜香港安畅CN2 VPS1核1G10M 28/月香港VPS[主机]
- 云计算竞争日趋白热化云计算行业市场前景分析全球[VPS测评]
- Weebly网站迁移到WordPress的实操上手。全球[VPS测评]
- 宝塔面板在香港服务器安装启动不了nginx怎么办?香港VPS[主机]
- 明恒互联:双旦同庆活动开启,100G国内高防云售价116元/月,香港云主香港VPS[主机]
- “休闲养蜂”风靡海外跨境电商追逐垂直风口全球[VPS测评]
- RangCloud:山东BGP NAT VPS,19元/首月,大带宽VP香港VPS[主机]
- 硅云香港云服务器促销活动:CPU性能100%性能,无需备案香港VPS[主机]
- 从阿里云七代云服务器,谈云计算四大趋势全球[VPS测评]
- 云米科技:庆祝愚人节活动,香港CN2 GIA/美国CERA VPS全场9美国VPS[主机]
- CIO和其他IT领导者充分利用边缘计算增强业务的4个关键全球[VPS测评]
- 尊云:河南BGP云服务器2核4G仅68.6元/月,823.2元/年;香港香港VPS[主机]
转载请注明原文地址:http://140.238.13.167:12355/read-205447.html











