bootstrapTable checkbox
时间: 2023-08-05 15:10:42 浏览: 209
如果你想在 Bootstrap Table 中添加复选框列,可以使用 `checkbox` 属性。以下是一个示例:
```html
<table id="myTable" data-toggle="table" data-url="data.json" data-checkbox="true">
<thead>
<tr>
<th data-field="state" data-checkbox="true"></th>
<th data-field="id">ID</th>
<th data-field="name">Name</th>
<th data-field="price">Price</th>
</tr>
</thead>
</table>
```
这个示例中,我们在表格的开头添加了一个复选框列。`data-checkbox="true"` 属性可以让整个表格都支持复选框选择。而 `data-field="state"` 属性指定了这一列的字段名为 `state`,这个字段名可以在后面的代码中使用。
如果你想在表格中获取选中的行,可以使用 `getSelections()` 方法。以下是一个示例:
```javascript
var selections = $('#myTable').bootstrapTable('getSelections');
```
这个方法返回一个包含选中行的数组。每个选中行都是一个 JavaScript 对象,包含了该行的所有数据。你可以遍历这个数组并对选中的行进行操作。
如果你想在选中行发生变化时触发一个事件,可以使用 `onCheck` 和 `onUncheck` 属性。以下是一个示例:
```javascript
$('#myTable').bootstrapTable({
onCheck: function(row) {
console.log('Row checked:', row);
},
onUncheck: function(row) {
console.log('Row unchecked:', row);
}
});
```
这个示例中,我们使用了 `onCheck` 和 `onUncheck` 事件,在选中和取消选中行时分别输出一条日志。
阅读全文