I am attempting to integrate a filter into my table.
You can view the table with the filter in action on this live demo. However, I am facing an issue where the filters are not narrowing down the results as expected. For instance, when I apply the ID filter of 3 and status of active, it should only show 1 result since there is only 1 user with an ID of 3 and status of Active. Instead, it displays all users with an ID of 3 and also all users with an active status.
Are there any adjustments that can be made to the createFilter function to achieve the desired output?
// Custom filter method for Angular Material Datatable
createFilter() {
let filterFunction = function (data: any, filter: string): boolean {
let searchTerms = JSON.parse(filter);
let isFilterSet = false;
for (const col in searchTerms) {
if (searchTerms[col].toString() !== '') {
isFilterSet = true;
} else {
delete searchTerms[col];
}
}
console.log(searchTerms);
let nameSearch = () => {
let found = false;
if (isFilterSet) {
for (const col in searchTerms) {
searchTerms[col].trim().toLowerCase().split(' ').forEach(word => {
if (data[col].toString().toLowerCase().indexOf(word) != -1 && isFilterSet) {
found = true;
}
});
}
return found;
} else {
return true;
}
};
return nameSearch();
};
return filterFunction;
}
You can find the tutorial I followed along with the source code on this website.