DataTableの単一ドロップダウンでの複数の列フィルタリング

Question

私はDataTables、jQuery Javascriptライブラリのプラグインを使用しています。既に検索とフィルタリングの可能性がありますが、私が探しているものは見つかりませんでした。

私は既にウェブを検索しましたが、私の質問に対する解決策はまだ見つかりませんでした。たぶん私は間違った用語を検索したので、私の問題に対する解決策が非常に単純な場合は申し訳ありません。

例テーブル：だから

は、私がやりたいことは以下の通りです：

• は、すべてのオプションは、カスタムフィルタを提供
• いくつかのフィルタオプションで一つのドロップダウンを提供（例えば 'option1'は利用可能なすべての レコードを表示し、 'option2'は が利用可能でラベルFを持つすべてのレコードを表示し、 'option3'は私は複数の列のフィルタリング/検索を行うオプションを提供ドロップダウンを作成する：利用可能 とラベルEを持って再、...）
• はすぐに「ライブ」

概要フィルタを適用します。

これをどのように達成できますか？これはDataTableでも可能ですか？

ありがとうございます。

Answer 1

これは、JS：このHTMLで

$(document).ready(function() { 
    var table = $('#example').DataTable(); 
    $('select[name="filter"]').change(function() { 
     if (!$(this).val()) { 
      table.columns().search("").draw(); 
     } else { 
      table.columns().search(""); 
      var option = $(this).find(":selected"); 
      var columns = Object.keys(option.data()); 
      console.log(columns) 
      $.each(columns, function(k, v){ 
       table.columns(parseInt(v, 10)).search(option.data(v)); 
      }); 
      table.draw(); 
     } 
    }); 
}); 

：

<select name="filter"> 
    <option value="">No filter</option> 
    <option data-1="Accountant">Filter Accountant</option> 
    <option data-2="Tokyo">Filter Tokyo</option> 
    <option data-1="Accountant" data-2="Tokyo">Filter Accountant in Tokyo</option> 
</select> 

はあなたが必要なものを行う必要があります。選択したオプションのデータ属性を繰り返し処理し、関連する列を検索します。 JSFiddleの作業here。

希望に役立ちます。