Custom search function doesn't work
Custom search function doesn't work
walrus
Posts: 5Questions: 2Answers: 0
I'm trying to build up custom search function that implements inclusive or logic across multiple columns using multiple criteria, but I can't seem to get it work properly - search returns empty result set.
My HTML:
<!doctype html>
<html>
<head>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
<script src="test2.js"></script>
<script src="mFilter.js"></script>
<link rel="stylesheet" type="text/css" href="test.css">
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css">
</head>
<body>
<table id="mytable"></table>
<button id="mybutton">Search for apple and vegies</button>
</body>
</html>
My jQuery:
var srcData = [
{name:"apple", category:"fruit"},
{name:"banana", category:"fruit"},
{name:"cabage", category:"vegie"},
{name:"carrot", category:"vegie"},
];
var dataTable = $('#mytable').DataTable({
sDom: 't',
data: srcData,
columns: [
{data: 'name', title: 'Name'},
{data: 'category', title: 'Category'}
]
});
$.fn.DataTable.ext.search.push(function(settings, searchData, index, rowData){
if(rowData.name == searchData[0] || rowData.category == searchData[1]) return true;
else return false;
});
$('#mybutton').on('click', function(){
dataTable.search(['apple','vegie']).draw();
});
and jsfiddle, just in case. Any help is greatly appreciated.
This question has an accepted answers - jump to answer
This discussion has been closed.
Answers
Hi @walrus ,
This page here should help. To search across two columns, you need to use regular expressions. So, on that page, search for
(Nash|Tokyo)in the "Global search", and check the "Treat as regex" checkbox. You'll need to do something like that in your code.Cheers,
Colin
@colin Thanks for your response, However, example that you refer to implements (kind of cascaded) AND logic - you search your table for one criteria within some particular column, than you search within your result set by another criteria / another column and so on.
Thus, back to my example, you will successfully find a row that has 'apple' in its name, but you won't be able to find any vegies in the resulting data set as they were filtered out at the first step.
Using global regex search will not work whatsoever, since by having 'an' within your search string, you'll get all the entries, matching that, regardless of the column, like 'Accountant' in 'position' field, 'Angelica Ramos' in the 'name' field and 'San Francisco' from 'office' column. So it's basically single criteria over multiple column search. I don't even mention that regex match is more expensive than exact match.
Hi @walrus ,
I don't quite follow, since I believe this here is doing what you want, and is following that example that I linked to.
Cheers,
Colin
There are a couple issues with your search plugin. First the search value is not passed as a parameter into the search plugins. You can store the value in a variable or it could be an input on the page. Second
searchDatais an array of the column data not the search term. Likely you will want to usesearchDatainstead ofrowDatafor the row values. This section of the search plugin describes the parameters and the differences betweensearchDataandrowData.I updated your example to use a global variable to store the search array and use
searchDatafor the row data. Instead of usingsearch()the button event simply usesdraw()to start the search process.http://jsfiddle.net/tn1Ljcfb/1/
In your case the search plugin isn't actually running as the global search of
dataTable.search(['apple','vegie']).draw();is actually clearing all the rows before the plugin would run. You are pushing the plugin on the end of the search array so it is executed last.Kevin
@colin There're two problems with your regex approach:
First, it works for that particular case with two column data set, but when you'll need to filter across bigger number of columns you'll either be struggling to make up appropriate regex (to match value in n-th column only) or you will not get it to work properly where you have same data value in different columns and different rows.
Second, regex matching multiple criteria across multiple columns will impose huge unnecessary load onto the browser, where you need to do strict 'x == y' matching with external search functions designed exactly for that purpose.
However, thank you for your effort.
@kthorngren Thanks a lot for your explanation. Now I've got the way it should work.
I've got to be honest, I didn't even spot there was a search plugin! Glad all working, good stuff, Kevin.