## 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 + '');
}
```