DataTableにボタンを適用しました。このボタンは、クリックするとデータテーブルをフィルターし、クリックされた行のみを表示します。
テーブルの初期化は次のとおりです。
var oDatatable = $("#tblDataTable").DataTable({
dom: '<"top"CRTl><"clear">rt<"bottom"ip><"clear">',
columns: [
{ data: 'Message' },
{ data: 'MessageId' },
{ data: null, "defaultContent": "<button id=\"tblRowData\">Click</button>"}
],
"columnDefs": [
{ "visible": false, "targets": 0 }
]
});
私のクリックイベントは次のとおりです。
$('#tblDataTable tbody').on('click', 'button', function (event) {
var data = oDataTable.row($(this).parents('tr')).data();
oDataTable
.columns(8)
.search(data['MessageId'])
.draw();
これはすべて完璧に機能しますが、ページで他のアクションが実行されたときにフィルターをリセットしたいと思います。たとえば、日時ピッカーの変更。
データテーブルに検索フィルターが適用されているかどうかを確認して削除するにはどうすればよいですか(つまり、クリックイベントの前にテーブルをリセットします)。
次のようなものを見ているかもしれません: http://www.datatables.net/plug-ins/api/fnFilterClear
非常に簡単な方法で検索をクリアできます。
var table = $('#example').DataTable();
table
.search( '' )
.columns().search( '' )
.draw();
もっと簡単に
var table = $('#example').DataTable();
table
.search("").draw();