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
- 性价比过低-NexusBytes→$21 年 384MB 内存 5GB 全球[VPS测评]
- 促销 $2 月 512M 内存 15G 硬盘 1T 流量 1Gbps K全球[VPS测评]
- 真实测评 四五互联江苏宿迁高防 VPS 和贵州 VPS 测评数据全球[VPS测评]
- nat.bz→1500 元 月 2 核 4GB 内存 20GB 空间 不虚拟空间(主机)
- 六六云香港三网 CN2 GIA VPS 速度及综合性能测评,七折优惠,月香港VPS[主机]
- 大盘鸡 servarica→加拿大 GPU VPS $15 月 AMD 全球[VPS测评]
- 投稿 vpsms→洛杉矶安畅 CN2 GIA 线路 全场季付 7 折 月全球[VPS测评]
- 稳定 搬瓦工 DC9 机房 CN2 GIA 线路 512M 内存套餐补货全球[VPS测评]
- 搬瓦工 VPS 一键安装 Windows 系统教程WINDOWS
- Toxic-Host→€3.5 月 8GB 内存 80GB SSD 空间虚拟空间(主机)
- WordPress代码实现用户注册时验证邮箱真实性全球[VPS测评]
- 搬瓦工VPS补货DC9 CN2 GIA限量促销年付39.99美金套餐全球[VPS测评]
- 如何根据业务需求选择合适的云服务器配置?全球[VPS测评]
- WHMCS 8.1如何简化注册页面全球[VPS测评]
- 74块钱一年的云服务器可以用来做什么?全球[VPS测评]
- 数据中心助力光纤光缆行业发展全球[VPS测评]
- 潮科技|阿里云发布第七代高主频云服务器ECS和含光800云服务器全球[VPS测评]
- 云服务器能干什么?有几十种玩法?阿里云,腾讯云服务器如何购买?全球[VPS测评]
- 6种样式社交论坛网站HTML5模板 - Social全球[VPS测评]
- 日主机,便宜美国CN2高防VPS¥19/月起,1Gbps带宽,香港多IP站群服务器[IP]
- 一万网络双蛋狂欢活动:2核2G5M云服务器仅377.46元/年全球[VPS测评]
- 六六云:1核1GB/15GB空间/1T流量/100Mbps/KVM/香港虚拟空间(主机)
- HostXen:双十一新用户香港、日本vps,送20元代金券,充值300日本VPS[主机]
- hosthatch:香港/芝加哥/伦敦等11机房VPS低至$17.5/年香港VPS[主机]
- 又有美议员窜访台,中国驻美大使馆:“中方将对美国的挑衅采取果断的反制措施美国VPS[主机]
- 孤狼云:香港沙田CN2/安畅CN2云服务器仅9.9元/月_香港虚拟主机2香港VPS[主机]
- 尊云双十二:国内4核4G5M云服务器仅28元/月,香港CN2VPS仅84香港VPS[主机]
- HostKvm:韩国香港vps10月份最新促销,海外VPS全场八折优惠韩国VPS[主机]
- TabbyCloud:1核/1GB/20GB/2TB流量/50Mbps/香港VPS[主机]
- 魔方云cubecloud:香港CN2VPS/美国CN2VPS终身88折/美国VPS[主机]
转载请注明原文地址:http://140.238.13.167:12355/read-211333.html











