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 三网直连 1Gbps 大带宽 KVM 架构 2 香港VPS[主机]
- TMThosting→$66.5 月-Dual L5520 24GB 1全球[VPS测评]
- WattaServer→$50 月 E3-1270v1 8GB 内存 1全球[VPS测评]
- STRATO→€1 月 512MB 内存 10GB SSD 空间 不限流虚拟空间(主机)
- DediPath→$69 月-E3 1240v2 16GB 2TB 1G全球[VPS测评]
- [11.11]HostDare 八折→洛杉矶 CN2 GIA 线路 KV全球[VPS测评]
- 双十二 磐石云→台湾 香港 洛杉矶云服务器限量 1 元秒杀 高防 IP香港VPS[主机]
- BandwagonHost→$29.89 季 1GB 内存 20GB S虚拟空间(主机)
- HostXen 双十一充值送 云主机充300元送50元 充600送150全球[VPS测评]
- akkocloud圣何塞/德国cn2gia,带宽免费升级300Mbps,全球[VPS测评]
- JustHost新上美国达拉斯机房,八折优惠,200M带宽不限流量,月付美国VPS[主机]
- 2022年 韩国云服务器 VPS 合辑韩国VPS[主机]
- 50KVM VPS免费自助换IP功能全球[VPS测评]
- HostUS → 洛杉矶Psychz → 1Core 512M 15G 全球[VPS测评]
- BBR对比BBR2BBRPLUSBBR2CAKE锐速哪个效果好全球[VPS测评]
- Centos7的firewall 防火墙如何设置端口转发?全球[VPS测评]
- JGKVM活动钜惠:美国cn2,香港cmi,大带宽vps,三网直连,10美国VPS[主机]
- 漂亮的Css3响应侧边栏菜单,动画风格侧边栏导航菜单样式全球[VPS测评]
- 潮科技|阿里云发布第七代高主频云服务器ECS和含光800云服务器全球[VPS测评]
- 者也IO,香港日本美国云服务器促销,2核2G1000元/2年,7折+内存日本VPS[主机]
- Vultr新用户100美金 最新活动来啦!新用户充值活动来了,充100美全球[VPS测评]
- 品光网络:香港美国免备案云服务器超低价,2核2G2M年付仅750元/年美国VPS[主机]
- 小欢互联:洛杉矶高防vps年付138元,香港CN2线路月付8元起,1核/香港VPS[主机]
- 麻花云怎么样?安徽移动vps月付29元/香港vps月付21元香港VPS[主机]
- 后浪云:优惠码”2021″,美国/香港2核4G2M云服务器仅32.5元/美国VPS[主机]
- 云服务器和服务器各有什么优缺点?全球[VPS测评]
- 麻花云双12年终盛典:香港云主机9元起,老客户续费6折;安徽BGP线路v香港VPS[主机]
- 人力资源管理系统前端Web模板 - SmartHR全球[VPS测评]
- 8K超高清记录中国空间站凌月:天和核心舱与问天实验舱组成“土”字结构虚拟空间(主机)
- Ceraus:香港CN2云服务器,香港GIA VPS去程移动回程路线,月香港VPS[主机]
转载请注明原文地址:http://140.238.13.167:12355/read-205447.html











