如何在DataTable中搜索多个列 [英] How can I search multiple columns in DataTables

问题描述

如果您查看此示例，我想能够搜索列名称和位置，使用正常搜索，忽略其余部分，但我仍然希望能够在 Office底部选择一个值列。

我试图使用这个：

  columnDefs：[{
 targets：[2]，
可搜索：false 
}] 
  

但这也会禁用列搜索。

我还试图在多个列上编写自定义搜索：

  var search ='Software'; 
 $（'＃example'）。DataTable（）。column（0）.search（search）.draw（）; 
 $（'＃example'）。DataTable（）。column（1）.search（search）.draw（）; 
  

但这只显示BOTH列包含搜索值的行，而不是其中的1行。 （不会发生）。

我还尝试了 columns（）。search（） ，但这与上面的自定义搜索相同。

如何启用单独的列搜索，但禁用整个搜索中的相同列？

解决方案

您可以使用 自定义过滤器覆盖内置的搜索/过滤器strong> ：

  $（'。dataTables_filter input'）。unbind .on（'keyup'，function（）{
 var searchTerm = this.value.toLowerCase（）; 
 $ .fn.dataTable.ext.search.push（function（settings，data，dataIndex） {
 //仅在列1和2中搜索
 if（〜data [0] .toLowerCase（）。indexOf（searchTerm））返回true; 
 if（〜data [1]）。 toLowerC ase（）。indexOf（searchTerm））return true; 
返回false; 
}）
 table.draw（）; 
 $ .fn.dataTable.ext.search.pop（）; 
}）
  

这样，普通搜索仅适用于前两列， 名称和位置 - 您仍然在页脚中有工作选择框。叉子小提琴 - > https://jsfiddle.net/g9gLjtjh/

I am trying to combine a column search and a normal search on specific columns.

If you look at this example, I want to be able to search the columns Name and Position, with the "normal" search, and ignore the rest of it, but I still want to be able to select an value at the bottom of the Office column.

I have tried to use this:

columnDefs: [{
    targets: [2],
    searchable: false
}]

But this also disables the column search.
I also tried to write an custom search on multiple columns:

var search = 'Software';
$('#example').DataTable().column(0).search(search).draw();
$('#example').DataTable().column(1).search(search).draw();

But this only shows the rows where BOTH columns contain the search value, instead of 1 of them. (which does not occur).

I also tried the columns().search(), but this gives the same result as the custom search above.

How can I enable the individual column search, but disable the same column from the overall search?

解决方案

You can override the built in search / filter with a custom filter :

$('.dataTables_filter input').unbind().on('keyup', function() {
    var searchTerm = this.value.toLowerCase();
    $.fn.dataTable.ext.search.push(function(settings, data, dataIndex) {
       //search only in column 1 and 2
       if (~data[0].toLowerCase().indexOf(searchTerm)) return true;
       if (~data[1].toLowerCase().indexOf(searchTerm)) return true;
       return false;
   })
   table.draw(); 
   $.fn.dataTable.ext.search.pop();
})

By this the "normal search" only applies to the first two columns, Name and Position - and you still have working select boxes in the footer. Forked fiddle -> https://jsfiddle.net/g9gLjtjh/

这篇关于如何在DataTable中搜索多个列的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！