1. 程式人生 > >bootstrap-table的一些參數配置

bootstrap-table的一些參數配置

選擇 條紋 loader num 匹配 left ins side repo

bootstrap-table的一些配置參數

[html] view plain copy
$(‘#reportTable‘).bootstrapTable({
method: ‘post‘,
url: ‘/qStock/AjaxPage‘,
dataType: "json",
striped: true, //使表格帶有條紋
pagination: true, //在表格底部顯示分頁工具欄
pageSize: 22,
pageNumber: 1,
pageList: [10, 20, 50, 100, 200, 500],
idField: "ProductId", //標識哪個字段為id主鍵
showToggle: false, //名片格式
cardView: false,//設置為True時顯示名片(card)布局
showColumns: true, //顯示隱藏列
showRefresh: true, //顯示刷新按鈕
singleSelect: true,//復選框只能選擇一條記錄
search: false,//是否顯示右上角的搜索框
clickToSelect: true,//點擊行即可選中單選/復選框
sidePagination: "server",//表格分頁的位置
queryParams: queryParams, //參數
queryParamsType: "limit", //參數格式,發送標準的RESTFul類型的參數請求
toolbar: "#toolbar", //設置工具欄的Id或者class
columns: column, //列
silent: true, //刷新事件必須設置
formatLoadingMessage: function () {
return "請稍等,正在加載中...";
},
formatNoMatches: function () { //沒有匹配的結果
return ‘無符合條件的記錄‘;
},
onLoadError: function (data) {
$(‘#reportTable‘).bootstrapTable(‘removeAll‘);
},
onClickRow: function (row) {
window.location.href = "/qStock/qProInfo/" + row.ProductId;
},
});

bootstrap-table帶參到後臺去的代碼

[html] view plain copy
function queryParams(params) { //配置參數
var temp = { //這裏的鍵的名字和控制器的變量名必須一直,這邊改動,控制器也需要改成一樣的
pageSize: params.limit, //頁面大小
pageNumber: params.pageNumber, //頁碼
minSize: $("#leftLabel").val(),
maxSize: $("#rightLabel").val(),
minPrice: $("#priceleftLabel").val(),
maxPrice: $("#pricerightLabel").val(),
Cut: Cut,
Color: Color,
Clarity: Clarity,
sort: params.sort, //排序列名
sortOrder: params.order//排位命令(desc,asc)
};
return temp;
}

bootstrap-table的一些參數配置