2016-09-16 30 views
4

dataTablesにドロップダウンフィルタを追加する場合は、1つの列にのみ追加します。 私は以下のコードを追加しているが、それはすべて列にドロップダウンを追加します。単一列のjquery datatablesプラグインにドロップダウンフィルタを追加する方法は?

this.api().columns(1).every(function() { 

$('#dataTables-example').DataTable({ 
    responsive: true, 
    "pageLength": 100, 
    "lengthMenu": [100, 250, 500, "All"], 
    initComplete: function() { 
     this.api().columns().every(function() { 
     var column = this; 
     $('#dataTables-example .head .head_hide').html(''); 

     var select = $('<select id="formfilter" class="filterdropdown"><option value="">'+$(column.header()).text()+'</option></select>') 
      .appendTo($(column.header()).empty()) 
      .on('change', function() { 
       var val = $.fn.dataTable.util.escapeRegex(
        $(this).val() 
       ); 
       column 
        .search(val ? '^'+val+'$' : '', true, false) 
        .draw(); 
      }); 

     column.data().unique().sort().each(function (d, j) { 
      select.append('<option value="'+d+'">'+d+'</option>') 
     }); 
    }); 
}); 
+0

あなたのコードをより慎重にフォーマットするために時間をかけてください。最終結果は理解しやすくなります!一貫してインデントし、タブとスペースを混同しないでください。 –

答えて

6

SOLUTION

変更

this.api().columns().every(function() { 

1はゼロベースの列インデックスです。特定の列にフィルタを追加する

NOTES

  • 代わりcolumns([1,3])形式を使用します。
  • フィルタをクリックするたびに列がソートされるため、その列の並べ替えを無効にする必要があります。それ以外の場合は、複数行ヘッダーを使用するか、フッタにフィルタを追加してください。
関連する問題