bootstrap table 一頁(yè)把數(shù)據(jù)顯示完了
問題描述
分頁(yè)設(shè)置的是“服務(wù)器分頁(yè)”,pageNumber、pageSize都是設(shè)置好了的,包括rows、total這些在服務(wù)器分頁(yè)里面必須的屬性全部都設(shè)置好了,但是再設(shè)置pageSize的時(shí)候,無(wú)論怎么修改,下方的分頁(yè)條是在變化,但表格里面卻顯示的是全部數(shù)據(jù),切換到下一頁(yè)還是跟上一頁(yè)一模一樣的內(nèi)容,查了好多資料都解決不了,想問一下怎么設(shè)置才能正常的顯示pageSize。
var $table = $('#table');$table.bootstrapTable({ url : 'data1.json', method: 'get', singleSelect: false, pageNumber:1, pageSize:10, queryParamsType: "limit", columns: [ {title: '序號(hào)',field: 'id',align: 'center',valign: 'middle' }, {title: '名稱',field: 'name',align: 'center',valign: 'middle' }, {title: '價(jià)格',field: 'price',align: 'center' }, {title: '操作',field: '',align: 'center',formatter:function(value,row,index){ var e = '<a href="#" mce_href="#" onclick="edit(''+ row.id + '')">編輯</a> '; var d = '<a href="#" mce_href="#" onclick="del(''+ row.id +'')">刪除</a> '; return e+d;} }]});
data1.json:
{ "rows":[{ "id": 0, "name": "test0", "price": "$0"},{ "id": 1, "name": "test1", "price": "$1"},{ "id": 2, "name": "test2", "price": "$2"},{ "id": 3, "name": "test3", "price": "$3"},{ "id": 4, "name": "test4", "price": "$4"},{ "id": 5, "name": "test5", "price": "$5"},{ "id": 6, "name": "test6", "price": "$6"},{ "id": 7, "name": "test7", "price": "$7"},{ "id": 8, "name": "test8", "price": "$8"},{ "id": 9, "name": "test9", "price": "$9"},{ "id": 10, "name": "test10", "price": "$10"},{ "id": 11, "name": "test11", "price": "$11"},{ "id": 12, "name": "test12", "price": "$12"},{ "id": 13, "name": "test13", "price": "$13"},{ "id": 14, "name": "test14", "price": "$14"},{ "id": 15, "name": "test15", "price": "$15"},{ "id": 16, "name": "test16", "price": "$16"},{ "id": 17, "name": "test17", "price": "$17"},{ "id": 18, "name": "test18", "price": "$18"},{ "id": 19, "name": "test19", "price": "$19"},{ "id": 20, "name": "test20", "price": "$20"} ], "total" : 21}
問題解答
回答1:贊同樓上,
如果是服務(wù)器分頁(yè),bootstrap table是把返回的數(shù)據(jù)原樣顯示吧,數(shù)據(jù)中要求的rows是為了展示,total是為了生成頁(yè)碼,分頁(yè)這個(gè)操作是在服務(wù)器做的。
如果是客戶端分頁(yè),就是把服務(wù)器返回的數(shù)據(jù)進(jìn)行前端分頁(yè),你應(yīng)該設(shè)置為客戶端分頁(yè),加載這個(gè)數(shù)據(jù)的時(shí)候就能分頁(yè)了。
回答2:首先你的出發(fā)點(diǎn)就搞錯(cuò)了,你請(qǐng)求的是本地的json ,實(shí)例項(xiàng)目是你把當(dāng)前的頁(yè)數(shù)發(fā)送給服務(wù)端,服務(wù)端給你返回當(dāng)頁(yè)的數(shù)據(jù)和總共的條目,前端負(fù)責(zé)根據(jù)總共的條數(shù)計(jì)算頁(yè)數(shù)然后顯示一共多少頁(yè),假設(shè)后端有100條,一頁(yè)10條,當(dāng)你請(qǐng)求第一頁(yè)的時(shí)候給你返回的是前十條數(shù)據(jù)和總條數(shù)100,不是一次都傳給你然后你自己分頁(yè),你想要是100萬(wàn)條數(shù)據(jù)要請(qǐng)求多久,
相關(guān)文章:
1. 關(guān)docker hub上有些鏡像的tag被標(biāo)記““This image has vulnerabilities””2. 前端 - ng-view不能加載進(jìn)模板3. docker容器呢SSH為什么連不通呢?4. android clickablespan獲取選中內(nèi)容5. docker綁定了nginx端口 外部訪問不到7. nignx - docker內(nèi)nginx 80端口被占用8. docker網(wǎng)絡(luò)端口映射,沒有方便點(diǎn)的操作方法么?9. angular.js - angular內(nèi)容過長(zhǎng)展開收起效果10. docker images顯示的鏡像過多,狗眼被亮瞎了,怎么辦?
