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
- 优惠 老鹰主机的三折优惠又来了 香港 美国 新加坡虚拟主机价格低至冰点美国VPS[主机]
- UEditor 赋值 html 数据无法按照原来样式显示怎么办?全球[VPS测评]
- php 判断数组是否有重复的值全球[VPS测评]
- 速度抢购 搬瓦工 37.79 美元套餐限量补货 双向 CN2 GIA 线全球[VPS测评]
- 疯狂猜成语 图猜成语一个人撒尿灭火是什么成语?全球[VPS测评]
- [黑五]HostDare→洛杉矶 CN2 GT KVM 七五折 年付 2全球[VPS测评]
- 疯狂猜成语 图猜成语两只金色的手在握手是什么成语?全球[VPS测评]
- DogYun→香港 KC 动态云阿里云 IP 线路上线 新开 7 折免设香港VPS[主机]
- 101 元 月 2 核 CPU 2G 内存 20G SSD 5T 流量 全球[VPS测评]
- 分享 OneDrive 多网盘挂载程序-CuteOne 安装教程全球[VPS测评]
- Sentris→$6.99 年 192MB 内存 15GB 空间 250虚拟空间(主机)
- 恒星云新春香港沙田CN2 VPS¥9.9起/月,成都高防¥144/月,大香港VPS[主机]
- Vultr VPS主机如何添加自定义防火墙规则全球[VPS测评]
- WordPress网站通过设置WP-Cron 定时任务删除恶意注册用户全球[VPS测评]
- AdvinServers → 黑五 8$ 月 日本 2C16G60G硬盘日本VPS[主机]
- 兼容移动和PC的loading加载和toast消息插件全球[VPS测评]
- VPS到底有什么用?全球[VPS测评]
- 拼多多拟建跨境电商平台:挖角SHEIN员工,0佣金招商入驻全球[VPS测评]
- 磐逸云:全场8折优惠,1核1G香港套餐月付24元,日本NNT线路套餐,月日本VPS[主机]
- LOCVPS,全新香港大浦CN2 VPS 2核4G内存3M仅54/月香港VPS[主机]
- tmhhost:8折优惠,美国cn2 gia高防vps,香港NTT vp美国VPS[主机]
- 亿速云“双11”上云狂欢大促 高防云服务器、裸金属服务器优惠套餐全球[VPS测评]
- Linux系统下安装Java JDK全球[VPS测评]
- 什么是云服务器?云服务器怎么登陆?全球[VPS测评]
- 六六云:美国cera机房CN2 GIA高防/香港CN2 GIA建站/CM美国VPS[主机]
- asiacloud怎么样?香港云服务器(cn2 gia),6折优惠,1GWINDOWS
- 七安云怎么样?香港CN2+BGP线路VPS 1核1G10M 16/月香港VPS[主机]
- Mysql连接数过高,如何检查?全球[VPS测评]
- 硅云香港云服务器促销活动:CPU性能100%性能,无需备案香港VPS[主机]
- 阿里行癫:如何理解当下的云计算全球[VPS测评]
转载请注明原文地址:http://140.238.13.167:12355/read-217297.html











