[Bootstrap-Table] 中的事件用例

[Bootstrap-Table] 中的事件

--------------------------------------------------

<div class="alert alert-success" id="events-result" data-es="Aquí se muestra el resultado del evento">
     Here is the result of event. 
</div>
<table id="events-table" data-url="data2.json" data-height="299" data-search="true" data-pagination="true" data-show-columns="true">
     <thead>
          <tr>
                   <th data-field="state" data-checkbox="true"></th>
                   <th data-field="id" data-sortable="true">Item ID</th>
                   <th data-field="name" data-sortable="true">Item Name</th>
                   <th data-field="price" data-sortable="true">Item Price</th>
           </tr>
       </thead>
</table>

View Code

--------------------------------------------------

 1 <script>
 2      $(function () {
 3          $('#basic-events-table').next().click(function () {
 4              $(this).hide();
 5              var $result = $('#events-result');
 6              $('#events-table').bootstrapTable({
 7                  /*
 8                      onAll: function (name, args) {
 9                          console.log('Event: onAll, data: ', args);
10                      }
11                      onClickRow: function (row) {
12                          $result.text('Event: onClickRow, data: ' + JSON.stringify(row));
13                      },
14                      onDblClickRow: function (row) {
15                          $result.text('Event: onDblClickRow, data: ' + JSON.stringify(row));
16                      },
17                      onSort: function (name, order) {
18                          $result.text('Event: onSort, data: ' + name + ', ' + order);
19                      },
20                      onCheck: function (row) {
21                          $result.text('Event: onCheck, data: ' + JSON.stringify(row));
22                      },
23                      onUncheck: function (row) {
24                          $result.text('Event: onUncheck, data: ' + JSON.stringify(row));
25                      },
26                      onCheckAll: function () {
27                          $result.text('Event: onCheckAll');
28                      },                 onUncheckAll: function () {
29                          $result.text('Event: onUncheckAll');
30                      },                 onLoadSuccess: function (data) {
31                          $result.text('Event: onLoadSuccess, data: ' + data);
32                      },                 onLoadError: function (status) {
33                          $result.text('Event: onLoadError, data: ' + status);
34                      },                 onColumnSwitch: function (field, checked) {
35                          $result.text('Event: onSort, data: ' + field + ', ' + checked);
36                      },                 onPageChange: function (number, size) {
37                          $result.text('Event: onPageChange, data: ' + number + ', ' + size);
38                      },                 onSearch: function (text) {
39                          $result.text('Event: onSearch, data: ' + text);
40                      }
41                  */
42              }).on('all.bs.table', function (e, name, args) {
43                  console.log('Event:', name, ', data:', args);
44              }).on('click-row.bs.table', function (e, row, $element) {
45                  $result.text('Event: click-row.bs.table, data: ' + JSON.stringify(row));
46              }).on('dbl-click-row.bs.table', function (e, row, $element) {
47                  $result.text('Event: dbl-click-row.bs.table, data: ' + JSON.stringify(row));
48              }).on('sort.bs.table', function (e, name, order) {
49                  $result.text('Event: sort.bs.table, data: ' + name + ', ' + order);
50              }).on('check.bs.table', function (e, row) {
51                  $result.text('Event: check.bs.table, data: ' + JSON.stringify(row));
52              }).on('uncheck.bs.table', function (e, row) {
53                  $result.text('Event: uncheck.bs.table, data: ' + JSON.stringify(row));
54              }).on('check-all.bs.table', function (e) {
55                  $result.text('Event: check-all.bs.table');
56              }).on('uncheck-all.bs.table', function (e) {
57                  $result.text('Event: uncheck-all.bs.table');
58              }).on('load-success.bs.table', function (e, data) {
59                  $result.text('Event: load-success.bs.table');
60              }).on('load-error.bs.table', function (e, status) {
61                  $result.text('Event: load-error.bs.table, data: ' + status);
62              }).on('column-switch.bs.table', function (e, field, checked) {
63                  $result.text('Event: column-switch.bs.table, data: ' +
64                      field + ', ' + checked);
65              }).on('page-change.bs.table', function (e, size, number) {
66                  $result.text('Event: page-change.bs.table, data: ' + number + ', ' + size);
67              }).on('search.bs.table', function (e, text) {
68                  $result.text('Event: search.bs.table, data: ' + text);
69              });
70          });
71      });
72  </script>

View Code

--------------------------------------------------

作者：码路工人

公众号：码路工人有力量（Code-Power）

欢迎关注个人微信公众号 Coder-Power

一起学习提高吧~

相关阅读:
mysql 取出每科成绩前两名
 mysql 数据库以及sql 的优化
 Twitter开源分布式自增ID算法snowflake
SVN 冲突
 VUE 入门 1 列表、if判断、双向绑定
 Roadblock
最大子序和
 SOLDIERS
绿豆蛙的归宿
 Place the Robots
原文地址：https://www.cnblogs.com/CoderMonkie/p/8349559.html