More than 5 years have passed since last update.

[Bootstrap-Table] JavaScriptでテーブル表示（その4）イベント

Last updated at 2018-12-26Posted at 2018-12-24

Bootstrap Table のイベントについて紹介します。

JavaScriptライブラリ

Bootstrap Table: 1.12.1

テーブルの描画

pre-body.bs.tableは、テーブルを描画が始まる前に発火するイベントです。

テーブルの描画前イベント

}).on('pre-body.bs.table', function (data) {
    log('[pre-body.bs.table]');
})

post-body.bs.tableは、テーブルを描画が終わったときに発火するイベントです。

テーブルの描画後イベント

}).on('post-body.bs.table', function (data) {
    log('[post-body.bs.table]');
})

click-row.bs.tableは、テーブルの行をクリックしたときに発火するイベントです。

行のクリックイベント

}).on('click-row.bs.table', function (element, row) {
    log('[click-row.bs.table] row=' + JSON.stringify(row));
})

click-cell.bs.tableは、テーブルのセルをクリックしたときに発火するイベントです。

セルのクリックイベント

}).on('click-cell.bs.table', function (element, field, value) {
    log('[click-cell.bs.table] field=' + field + ', value=' + value);
})

check.bs.tableは、チェックボックスのチェック（あり）のときに発火するイベントです。

チェックボックスありイベント

}).on('check.bs.table', function (element, row) {
    log('[check.bs.table] row=' + JSON.stringify(row));
})

uncheck.bs.tableは、チェックボックスのチェック（なし）のときに発火するイベントです。

チェックボックスなしイベント

}).on('uncheck.bs.table', function (element, row) {
    log('[uncheck.bs.table] row=' + JSON.stringify(row));
})

sort.bs.tableは、テーブルのカラムをクリックしてソートしたときに発火するイベントです。

ソートイベント

}).on('sort.bs.table', function (element, name, order) {
    log('[sort.bs.table] name=' + name + ', order=' + order);
})

page-change.bs.tableは、テーブルのページを変更したときに発火するイベントです。

ページングイベント

}).on('page-change.bs.table', function (event, size) {
    log('[page-change.bs.table] page=' + size);
})

以上です。