bootstrap table配置參數(shù)例子
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)識哪個字段為id主鍵
showToggle: false, //名片格式
cardView: false,//設(shè)置為True時顯示名片(card)布局
showColumns: true, //顯示隱藏列
showRefresh: true, //顯示刷新按鈕
singleSelect: true,//復(fù)選框只能選擇一條記錄
search: false,//是否顯示右上角的搜索框
clickToSelect: true,//點擊行即可選中單選/復(fù)選框
sidePagination: "server",//表格分頁的位置
queryParams: queryParams, //參數(shù)
queryParamsType: "limit", //參數(shù)格式,發(fā)送標(biāo)準(zhǔn)的RESTFul類型的參數(shù)請求
toolbar: "#toolbar", //設(shè)置工具欄的Id或者class
columns: column, //列
silent: true, //刷新事件必須設(shè)置
formatLoadingMessage: function () {
return "請稍等,正在加載中...";
},
formatNoMatches: function () { //沒有匹配的結(jié)果
return '無符合條件的記錄';
},
onLoadError: function (data) {
$('#reportTable').bootstrapTable('removeAll');
},
onClickRow: function (row) {
window.location.href = "/qStock/qProInfo/" + row.ProductId;
},
});
bootstrap-table帶參到后臺去的代碼
function queryParams(params) { //配置參數(shù)
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;
}
參考:http://www.dhdzp.com/article/93246.htm
如果大家還想深入學(xué)習(xí),可以點擊這里進(jìn)行學(xué)習(xí),再為大家附3個精彩的專題:
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
- Bootstrap標(biāo)簽頁(Tab)插件使用方法
- 簡單實現(xiàn)Bootstrap標(biāo)簽頁
- BootStrap框架個人總結(jié)(bootstrap框架、導(dǎo)航條、下拉菜單、輪播廣告carousel、柵格系統(tǒng)布局、標(biāo)簽頁tabs、模態(tài)框、菜單定位)
- Bootstrap每天必學(xué)之標(biāo)簽頁(Tab)插件
- bootstrap table 數(shù)據(jù)表格行內(nèi)修改的實現(xiàn)代碼
- bootstrap jquery dataTable 異步ajax刷新表格數(shù)據(jù)的實現(xiàn)方法
- BootStrapTable 單選及取值的實現(xiàn)方法
- Bootstrap table兩種分頁示例
- 基于Bootstrap的標(biāo)簽頁組件及bootstrap-tab使用說明
相關(guān)文章
js+HTML5實現(xiàn)canvas多種顏色漸變效果的方法
這篇文章主要介紹了js+HTML5實現(xiàn)canvas多種顏色漸變效果的方法,涉及html5屬性的相關(guān)技巧,需要的朋友可以參考下2015-06-06
JavaScript遍歷table表格中的某行某列并打印其值
這篇文章主要介紹了JavaScript遍歷table表格中的某行某列并打印其值,需要的朋友可以參考下2014-07-07
JavaScript學(xué)習(xí)筆記之取數(shù)組中最大值和最小值
在實際業(yè)務(wù)中有的時候要取出數(shù)組中的最大值或最小值。但在數(shù)組中并沒有提供arr.max()和arr.min()這樣的方法。那么是不是可以通過別的方式實現(xiàn)類似這樣的方法呢?那么今天我們就來整理取出數(shù)組中最大值和最小值的一些方法,需要的朋友一起學(xué)習(xí)吧2016-03-03
Bootbox將后臺JSON數(shù)據(jù)填充Form表單的實例代碼
通過控制器創(chuàng)建一個Index視圖,寫入下列HTML代碼,這里我創(chuàng)建了一個分部視圖,不創(chuàng)建直接寫在同一個頁面也是一樣的效果。這篇文章主要介紹了Bootbox將后臺JSON數(shù)據(jù)填充Form表單 ,需要的朋友可以參考下2018-09-09
js使用棧來實現(xiàn)10進(jìn)制轉(zhuǎn)8進(jìn)制與取除數(shù)及余數(shù)
這篇文章主要介紹了js使用棧來實現(xiàn)10進(jìn)制轉(zhuǎn)8進(jìn)制、js取除數(shù)、余數(shù),需要的朋友可以參考下2014-06-06

