1.bootstrap-table使用背景分頁時,請求方式為post的時候,必須添加contentType: “application/x-www-form-urlencoded”,參數,get請求時可以不需要;
2.注意controller接口的參數要與之對應,設定queryParamsType
queryParamsType:”, //預設值為 ‘limit’ ,在預設情況下 傳給服務端的參數為:offset,limit,sort
// 設定為 ” 在這種情況下傳給伺服器的參數為:pageSize,pageNumber
3.bootstrap-table背景需要讀total(總記錄數)和rows(詳細資料),是以最好自己組裝一個PageBean進行封裝,裡面包含total和rows屬性。
完整代碼如下:
<!--清單展示-->
<div class="table-responsive" id="listDiv">
<table class="table table-striped table-hover" id="userTable">
</table>
</div>
var urlStr = '/user-web/user/getUserByPage.do';
$('#userTable').bootstrapTable({
method: 'get', //請求方式(*)
//contentType: "application/x-www-form-urlencoded",
toolbar: '#toolbar', //工具按鈕用哪個容器
striped: true, //是否顯示行間隔色
cache: false, //是否使用緩存,預設為true,是以一般情況下需要設定一下這個屬性(*)
pagination: true, //是否顯示分頁(*)
sortable: false, //是否啟用排序
sortOrder: "asc", //排序方式
queryParamsType:'', //預設值為 'limit' ,在預設情況下 傳給服務端的參數為:offset,limit,sort
// 設定為 '' 在這種情況下傳給伺服器的參數為:pageSize,pageNumber
queryParams: function queryParams(params) {
var param = {
pageNumber: params.pageNumber,
pageSize: params.pageSize
};
return param;
},
sidePagination: "server", //分頁方式:client用戶端分頁,server服務端分頁(*)
pageNumber:, //初始化加載第一頁,預設第一頁
pageSize: , //每頁的記錄行數(*)
pageList: [, , ], //可供選擇的每頁的行數(*)
strictSearch: true,
clickToSelect: true, //是否啟用點選選中行
height: , //行高,如果沒有設定height屬性,表格自動根據記錄條數覺得表格高度
uniqueId: "id", //每一行的唯一辨別,一般為主鍵列
cardView: false, //是否顯示詳細視圖
detailView: false, //是否顯示父子表
url: urlStr, //請求背景的URL(*)
columns: [{
checkbox : true
}, {
field: 'id',
title: '學号'
}, {
field: 'name',
title: '姓名'
}, {
field: 'gender',
title: '性别'
}, {
field: 'age',
title: '年齡'
}, {
field: 'description',
title: '描述'
}
]
});
controller:
@RequestMapping(value = "/getUserByPage", method = RequestMethod.GET)
@ResponseBody
public PageBean<UserDto> getUserByPage(Integer pageSize, Integer pageNumber) throws Exception {
System.out.println("--------->>>>>" + pageSize + pageNumber);
return userService.getUserByPage(pageSize, pageNumber);
}
service和dao我就不再贅述了,sql語句為:
offset = (pageNumber-1)*pageSize
自己組裝的pageBean.java(省略get和set方法)
public class PageBean<T> implements Serializable {
private static final long serialVersionUID = L;
private int pageSize;
private int pageNum;
private int total; //不能變
private int offset;
private List<T> rows; //不能變
}
參考:http://www.cnblogs.com/flyins/p/6752285.html