カスタマイズは、私はDataTableのjqueryのからの検索プロパティを変更したいのDataTableのjQuery

Question

を「検索」https://datatables.net/examples/api/multi_filter.html のDataTableの下部にあるいくつかの入力テキストフィールドは、それらのそれぞれがためのフィルタでありますが、対応する列。

私が達成したいのは、他のレイアウトを使用して入力テキストフィールドを使用して独自のフォームを作成したいからです。これらの入力テキストフィールドをDataTableから取り出すことです。

$('#example tfoot th').each(function() { 
    var title = $(this).text(); 
    $(this).html('<input type="text" placeholder="Search '+title+'" />'); 
}); 

ことができます：私は例のコードのこの部分があることだと思う何

（私は自分のフォームに多くのダイナミズムを与えるための「検索」プロパティの迅速な応答を利用したいです）

<input type="text" placeholder="Search " class="test" /> 
<input type="text" placeholder="Search " class="test" /> 
<input type="text" placeholder="Search " class="test" /> 
<input type="text" placeholder="Search " class="test" /> 
<input type="text" placeholder="Search " class="test" /> 
<input type="text" placeholder="Search " class="test" /> 
<input type="text" placeholder="Search " class="test" /> 
<input type="text" placeholder="Search " class="test" /> 
<input type="text" placeholder="Search " class="test" /> 
<input type="text" placeholder="Search " class="test" /> 

しかし、私が把握いけないことは、コード

table.columns().every(function() { 
     var that = this; 

     $('input', this.footer()).on('keyup change', function() { 
      if (that.search() !== this.value) { 
       that 
        .search(this.value) 
        .draw(); 
      } 
     }); 
    }); 

のこの部分を変更する方法です：Webページの他の場所で自分の単純なHTMLテキスト入力フィールドに置き換えます

私は自分の入力テキストフィールドを使用してみましたので、私はラインに置き換え：、警告文と自分の入力テキストフィールドとデバッグといくつかのテストの後

$('input.test').on('keyup change', function() { alert('inside') 

：によって

$('input', this.footer()).on('keyup change', function() { 

を私は、この関数はすべてが "テスト"クラスを持っているので、多くの入力テキストファイルが存在するので、この関数が何度も実行されていることに気付きました。しかし、いずれにしても、この「検索」プロパティはこの入力テキストフィールドでは機能していません。

目標を達成するためにこのDataTableを修正する適切な方法についてのヒントを教えていただけますか？

Answer 1

inputが特定の列に接続されるようにすることができます。

<input id="column_3_search" type="text" placeholder="Search " class="test" /> 

JS：それはそれだけであなたが

HTML指定する列フィルタリングします、である。 VARテーブル= $（ '＃の例を'）のDataTable（）;

$('#column_3_search').on('keyup', function() { 
    table 
     .columns(3) 
     .search(this.value) 
     .draw(); 
}); 

これは、列3