web-dev-qa-db-ja.com

Datatablesの検索ボックスに入力された値を取得する方法

Datatablesの検索ボックスに入力された値を取得する方法。データテーブルの検索ボックスに値を入力する方法はありますか？

jquerydatatablesjquery-datatables
16
jessi

検索の実行時に値を確認するだけの場合[dataTables1.10.x]：

var table = $('#example').DataTable();

$('#example').on('search.dt', function() {
    var value = $('.dataTables_filter input').val();
    console.log(value); // <-- the value
});

検索の前に値を確認し、検索をキャンセルできるようにするには、デフォルトの検索ボックスイベントのバインドを解除し、次のように独自のイベントを作成する必要があります。ユーザーが3文字以上入力した場合のみ検索します。

$('.dataTables_filter input').unbind().keyup(function() {
    var value = $(this).val();
    if (value.length>3) {
        table.search(value).draw();
    } 
});

デモ->http://jsfiddle.net/pb0632c3/

ユーザーが検索語を削除した場合など、検索/フィルターを完全にリセットするには：

if (value.length==0) table.search('').draw();
32
davidkonrad

はい。有る。パラメータなしで検索メソッドを呼び出すだけです。

var query = dataTable.search()

7
peter

dataTable api で述べたように

    var table = $('.datatable').DataTable();


     $('.datatable').on('search.dt', function (e, settings) {
       table.search( this.value ).draw();
    })

    //or custom input
    // #myInput is a <input type="text" id="myInput"> element
    $('#myInput').on( 'keyup', function () {
        table.search( this.value ).draw();
    });
4
Herbi Shtini

すべてのデータテーブルバージョンでこのような動作をすることができますここで行っているのは、検索入力フィールドを追跡し、このメソッドを使用してデータテーブルAPIを使用するだけでその値を取得することです

$('input[type="search"]').on( 'keyup', function () {
            console.log($(this).val());
} );
0
Jasbin Karki

この機能を試して、キーが押されたことを検出し、DataTableeを描画します。

$('#search').on('keyup change', function () {
    var table = $('#example').DataTable();
    table.api().search($(this).val()).draw();
});
0
Rock