2014-06-12 71 views
4

我正在使用datatables插件,我想禁用表上的自動過濾器,而是當他們已經完全輸入文本,並準備進一步搜索時,把一個搜索按鈕。datatables禁用自動過濾器,並添加了一個按鈕

的jsfiddle:

$(document).ready(function() { 
    $('#example').dataTable(); 
}); 

http://jsfiddle.net/84KNZ/

按鈕(HREF)是 「去過濾」

什麼想法?

感謝

+0

請添加一些有意義的代碼和這裏是一個問題描述。欲瞭解更多幫助,請參閱http://stackoverflow.com/help/mcve – Steve

+0

好的完成..謝謝 – user3734830

回答

12

首先要做的是解除綁定搜索輸入默認的keyup事件:

$("div.dataTables_filter input").unbind(); 

然後我們需要調用從鏈接點擊事件的數據表過濾:

$('#filter').click(function(e){ 
     oTable.fnFilter($("div.dataTables_filter input").val()); 
    }); 

http://jsfiddle.net/84KNZ/3/

+0

只是完美! – user3734830

+0

是的,工作。你能告訴我如何在搜索框旁邊添加一個按鈕嗎? –

+1

@HalfBloodPrince這將在輸入的右側添加一個搜索按鈕。 $('div.dataTables_filter label')。append(''); 如果您這樣做,不要忘記將onClick函數的選擇器更改爲'#exampleDataSearchButton'而不是'#filter'。 我也通過使用: $(「div.dataTables_filter label」)。html($(「div.dataTables_filter label」)。html()來擺脫輸入左側的'搜索:'文本。 (「Search:」)。join(「」)) – kaelle

2

如果你正在使用服務器端處理器噝聲,fnFilter不工作,你必須使用搜索,同時,這將是更好地按在搜索文本框中輸入進行搜索,這樣就可以實現如下:

 $("div.dataTables_filter input").unbind(); 

     $("div.dataTables_filter input").on('keydown', function(e) { 
      if (e.which == 13) { 
       table.search($("div.dataTables_filter input").val()).draw(); 
      } 
     }); 
+2

這個答案有誤導性。 'fnFilter'可以和服務器端處理一起工作,但它是v1.9語法。 'search()'是正確的v1.10語法,但這不是你所說的。 – markpsmith

相關問題