自定義「搜索」的DataTable Jquery的

Question

我想修改從數據表中的jQuery的搜索屬性：

在這個例子中：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+'" />'); 
}); 

可替換爲我自己簡單的HTML輸入文本字段在其他地方的網頁：

<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(); 
      } 
     }); 
    }); 

的這部分

我試圖用我自己的輸入文本字段，所以我取代了線：

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

通過：

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

一些測試用自己的輸入文本字段和調試，提醒語句之後，我意識到這個函數執行的次數與輸入文本的大小一樣多，因爲它們都具有「測試」類。但是，無論如何，「搜索」屬性在此輸入文本字段中不起作用。

你可以給我一些關於修改這個DataTable以實現我的目標的適當方法的提示嗎？

Answer 1

您可以這樣做，使input連接到特定的列。也就是說，它只會篩選您指定

HTML列：

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

JS： VAR表= $（ '＃例如'）的DataTable（）;

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

這將允許在你的input文本輸入過濾僅在值基於您的表列3