layout: docs title: Events description: The Events API of Bootstrap Table. group: api
To use event syntax:
{% highlight html %} $('#table').bootstrapTable({ onEventName: function (arg1, arg2, ...) {
// ...
} })
$('#table').on('event-name.bs.table', function (e, arg1, arg2, ...) { // ... }) {% endhighlight %}
jQuery Event: all.bs.table
Parameter: name, args
Detail:
Fires when all events trigger, the parameters contain:
name
: the event name,args
: the event data.jQuery Event: click-row.bs.table
Parameter: row, $element, field
Detail:
Fires when user click a row, the parameters contain:
row
: the record corresponding to the clicked row.$element
: the tr element.field
: the field name corresponding to the clicked cell.jQuery Event: dbl-click-row.bs.table
Parameter: row, $element, field
Detail:
Fires when user double click a row, the parameters contain:
row
: the record corresponding to the clicked row.$element
: the tr element.field
: the field name corresponding to the clicked cell.jQuery Event: click-cell.bs.table
Parameter: field, value, row, $element
Detail:
Fires when user click a cell, the parameters contain:
field
: the field name corresponding to the clicked cell.value
: the data value corresponding to the clicked cell.row
: the record corresponding to the clicked row.$element
: the td element.jQuery Event: dbl-click-cell.bs.table
Parameter: field, value, row, $element
Detail:
Fires when user double click a cell, the parameters contain:
field
: the field name corresponding to the clicked cell.value
: the data value corresponding to the clicked cell.row
: the record corresponding to the clicked row.$element
: the td element.jQuery Event: sort.bs.table
Parameter: name, order
Detail:
Fires when user sort a column, the parameters contain:
name
: the sort column field name.order
: the sort column order.jQuery Event: check.bs.table
Parameter: row, $element
Detail:
Fires when user check a row, the parameters contain:
row
: the record corresponding to the clicked row.$element
: the DOM element checked.jQuery Event: uncheck.bs.table
Parameter: row, $element
Detail:
Fires when user uncheck a row, the parameters contain:
row
: the record corresponding to the clicked row.$element
: the DOM element unchecked.jQuery Event: check-all.bs.table
Parameter: rows
Detail:
Fires when user check all rows, the parameters contain:
rows
: array of records corresponding to newly checked rows.jQuery Event: uncheck-all.bs.table
Parameter: rows
Detail:
Fires when user uncheck all rows, the parameters contain:
rows
: array of records corresponding to previously checked rows.jQuery Event: check-some.bs.table
Parameter: rows
Detail:
Fires when user check some rows, the parameters contain:
rows
: array of records corresponding to newly checked rows.jQuery Event: uncheck-some.bs.table
Parameter: rows
Detail:
Fires when user uncheck some rows, the parameters contain:
rows
: array of records corresponding to previously checked rows.jQuery Event: load-success.bs.table
Parameter: data
Detail:
Fires when remote data is loaded successfully, the parameters contain:
data
: the remote data.jQuery Event: load-error.bs.table
Parameter: status, jqXHR
Detail:
Fires when some errors occur to load remote data, the parameters contain:
status
: the status code of jqXHR
.jqXHR
: jqXHR object, which is a superset of the XMLHTTPRequest object. For more information, see the jqXHR Type.jQuery Event: column-switch.bs.table
Parameter: field, checked
Detail:
Fires when switch the column visible, the parameters contain:
field
: the field name corresponding to the switch column.checked
: the checked state of the column.jQuery Event: page-change.bs.table
Parameter: number, size
Detail:
Fires when change the page number or page size, the parameters contain:
number
: the page number.size
: the page size.jQuery Event: search.bs.table
Parameter: text
Detail:
Fires when search the table, the parameters contain:
text
: the text of the search input.jQuery Event: toggle.bs.table
Parameter: cardView
Detail:
Fires when toggle the view of table, the parameters contain:
cardView
: the cardView state of the table.jQuery Event: pre-body.bs.table
Parameter: data
Detail:
Fires before the table body is rendered, the parameters contain:
data
: the rendered data.jQuery Event: post-body.bs.table
Parameter: data
Detail:
Fires after the table body is rendered and available in the DOM, the parameters contain:
data
: the rendered data.jQuery Event: post-header.bs.table
Parameter: undefined
Detail:
Fires after the table header is rendered and availble in the DOM.
jQuery Event: expand-row.bs.table
Parameter: index, row, $detail
Detail:
Fires when click the detail icon to expand the detail view, the parameters contain:
index
: the index of the expanded row.row
: the record corresponding to the expanded row.$detail
: the DOM element of the detail div
after current tr
element, you can use jQuery methods to custom the detail views.jQuery Event: collapse-row.bs.table
Parameter: index, row
Detail:
Fires when click the detail icon to collapse the detail view, the parameters contain:
index
: the index of the collapsed row.row
: the record corresponding to the collapsed row.jQuery Event: refresh-options.bs.table
Parameter: options
Detail:
Fires after refresh the options and before destroy and init the table, the parameters contain:
options
: the table options object.jQuery Event: reset-view.bs.table
Parameter: undefined
Detail:
Fires when reset view of the table.
jQuery Event: refresh.bs.table
Parameter: params
Detail:
Fires after the click the refresh button, the parameters contain:
params
: the additional parameters request to the server.jQuery Event: scroll-body.bs.table
Parameter:: undefined
Detail:
Fires when table body scroll.