Bootstrap Table 学习笔记之表格事件（一）

完整内容请查看官方文档。

onAll

所有的事件都会触发该事件，参数包括——name：事件名，args：事件的参数。

点击行事件：

onClickRow

当用户点击某一行的时候触发，参数包括——row：点击行的数据，$element：tr 元素，field：点击列的 field 名称。

• 代码示例：

• 效果：

image.png

同时在文档中还提供了jquery的调用方法：

image.png

使用方法如下：

• 效果：

image.png

每一个事件都可以改写成这种绑定的方式，具体写法查阅官方文档。

onDblClickRow

当用户双击某一行的时候触发，使用方法同上。

点击列事件：

onClickCell

当用户单击某一列的时候触发，参数包括——field：点击列的 field 名称，value：点击列的 value 值，row：点击列的整行数据，$element：td 元素。

• 代码示例：

• 效果：

image.png

onDblClickCell

当用户双击某一列的时候触发，用法同上。

onSort

用户排序列时触发，参数包含——name：排序列字段名称，order：排序列顺序。

• 使用说明：需要在列参数中定义sortable:true
• 代码示例：

• 效果：

image.png

选择事件触发的方法：

onCheck

当选中一行时触发的函数，参数——row：选中行的数据。

• 代码示例：

• 效果：

image.png

onUncheck

取消选中一行时触发的函数。

onCheckAll

全选时触发的函数。

onUncheckAll

取消全选时触发的函数。

数据加载触发的函数

onLoadSuccess

表格数据加载成功时触发的函数。

onLoadError

表格数据加载失败时触发的函数

onColumnSwitch

当某一列隐藏/显示时触发，与showColumns:true一起使用。

• 代码示例：

• 效果：

image.png

将年龄列隐藏时弹出age：

image.png

onPageChange

更改页码或更改页面数据条数时触发。

onSearch

搜索表格数据时触发

onToggle

切换视图时触发。

onExpandRow

当点击详细图标展开详细页面的时候触发。

onCollapseRow

当点击详细图片收起详细页面的时候触发。

onRefresh

点击刷新按钮后触发。