快捷導(dǎo)航

bootstrap table配置參數(shù)例子

更新時(shí)間：2017年01月05日 14:00:34 作者：paincupid

這篇文章主要為大家詳細(xì)介紹了bootstrapTable的參數(shù)設(shè)置，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下

bootstrap-table的一些配置參數(shù)：

$('#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", //標(biāo)識(shí)哪個(gè)字段為id主鍵 
 showToggle: false, //名片格式 
 cardView: false,//設(shè)置為True時(shí)顯示名片（card）布局 
 showColumns: true, //顯示隱藏列 
 showRefresh: true, //顯示刷新按鈕 
 singleSelect: true,//復(fù)選框只能選擇一條記錄 
 search: false,//是否顯示右上角的搜索框 
 clickToSelect: true,//點(diǎn)擊行即可選中單選/復(fù)選框 
 sidePagination: "server",//表格分頁的位置 
 queryParams: queryParams, //參數(shù) 
 queryParamsType: "limit", //參數(shù)格式,發(fā)送標(biāo)準(zhǔn)的RESTFul類型的參數(shù)請(qǐng)求 
 toolbar: "#toolbar", //設(shè)置工具欄的Id或者class 
 columns: column, //列 
 silent: true, //刷新事件必須設(shè)置 
 formatLoadingMessage: function () { 
 return "請(qǐng)稍等，正在加載中..."; 
 }, 
 formatNoMatches: function () { //沒有匹配的結(jié)果 
 return '無符合條件的記錄'; 
 }, 
 onLoadError: function (data) { 
 $('#reportTable').bootstrapTable('removeAll'); 
 }, 
 onClickRow: function (row) { 
 window.location.href = "/qStock/qProInfo/" + row.ProductId; 
 }, 
});

bootstrap-table帶參到后臺(tái)去的代碼

function queryParams(params) { //配置參數(shù) 
 var temp = { //這里的鍵的名字和控制器的變量名必須一直，這邊改動(dòng)，控制器也需要改成一樣的 
 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; 
 }

參考：http://www.dbjr.com.cn/article/93246.htm

如果大家還想深入學(xué)習(xí)，可以點(diǎn)擊這里進(jìn)行學(xué)習(xí)，再為大家附3個(gè)精彩的專題：

Bootstrap學(xué)習(xí)教程

Bootstrap實(shí)戰(zhàn)教程

Bootstrap Table使用教程

Bootstrap插件使用教程

以上就是本文的全部內(nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章: