## url
數據獲取請求地址,根據不同的配置需要這個地址返回不同格式的數據。
返回示例:{rows:[{},{},{}],total:3}
初始化時會請求一次。
## sidePagination
server:表示分頁將由服務端來控制,向服務端發起請求時會攜帶分頁參數,點擊頁碼時會再次請求url
如果不設置該參數:則點擊頁碼時不會請求url,而是利用已有數據(如初始化時獲取的數據)進行分頁。
client:客戶端分頁
## method
請求方式 get/post 默認是get
## queryParams
請求url前調用的方法 function(params){return params;}
此方法返回的的數,即請求時的參數,可以利用該屬性設置請求時的額外參數。
## pagination
是否支持分頁
true:將顯示頁碼
false:不顯示頁碼
## pageNumber,
初始化時顯示第幾頁 如 1,
## pageSize
初始化時每頁顯示多少項數據 如 50
## pageList
設置支持每頁顯示多少項,如[50,100,500]這樣就可以選擇每頁顯示的數據量
## search
是否支持搜索
true : 支持搜索將顯示搜索框,并且在用戶輸入內容時會觸發搜索,請求url時會攜帶參數 search=搜索框內容
## sortable
是否支持排序
true:點擊表頭后重排數據
如果設置sidePagination:"server",每次點表頭時會請求url并且傳遞排序參數
sort:表示被點擊的表頭的 鍵
order:表示排序方式 asc/desc
該功能需要跟columns中的sortable配合使用(即指定哪些列支持排序)
## clickToSelect
是否啟用點擊行選中
true:當tr的任何部分被點擊后,都會選中checkbox
## columns
表頭配置,該屬性的值為一個數組[],每一個項為一個列的配置參數。示例
```
[{title:"姓名",width:40,field:"name"},{title:"年齡",width:40,field:"age"}]
```
title:列表頭名稱
width:列寬度
field:引用值(比如接口返回的數據row中的信息為[{name:"張三"},{name:"李四"}]),這個field設置為"name"時對應的就是其值。
sortable:知否支持排序(true/false)
formatter:自定義單元格中的值(如果設置了此屬性,field則會失效)
該屬性的值為一個方法function(value,?row,?index),需要return 一個字符串,這個字符串則是單元格中的內容。
- value: undefied
- row:為當前項數據,如:{name:"張三"}
- index:為當前序號 從0開始。
checkbox:
是否顯示為復選框,true/false
設置了此屬性后 其他屬性都不用設置。
獲得選中項 $("#表id").bootstrapTable('getSelections');
events:單元格中元素事件配置
取值示例
```
{
'click .detail' :function(e, value, row, index){
e:事件對象
value: undefined
row:當前項(行)的對象
index:序號
}
}
```
## rowStyle
根據條件為行設置指定的類
值為 function(row, index)
返回一個對象
示例:
```
function(row, index){
return {classes:"active_tr"}
}
```
即給此tr設置一個類名。
## showColumns
是否顯示表頭控制列表,用來控制表頭的可見性。
true:顯示,需要引入 font-awesome 才能正常顯示圖標
## minimumCountColumns
至少顯示多少列,限制showColumns隱藏列的操作。
## showRefresh
顯示刷新表格按鈕,即點擊按鈕重新請求下url
## showToggle
true:顯示切換按鈕,切換 表格顯示模式,和卡片顯示模式。
## cardView
true:以卡片模式顯示
## detailView
true:開啟詳情模式 在每一行前面顯示一個加號,點擊加號會在此行下面顯示其他內容即子表格。
配合onExpandRow屬性使用,即當點擊加號時就會觸發該方法
```
function?(index,?row,?$detail)?
{
//index:父表當前行的行索引。
//row:父表當前行的Json數據對象。
//$detail:當前行下面創建的新行里面的td對象。
}
```
具體詳子級中需要展示什么內容,就是向$detail中添加元素。
示例1:添加子表格
```
function?(index,?row,?$detail)?
{
var cur_table = $detail.html('<table></table>').find('table');
$(cur_table).bootstrapTable({
url: 'server.php',
columns: [
{
field: 'name',
title: '姓名',
sortable : true,
}
]
}
```
示例2:添加其他內容
```
function?(index,?row,?$detail)?
{
$detail.html('你好'?+?row.name?+?'');
}
```