I am using jquery datatables to make my table searchable. I have a dropdown that filters a gender column:
$("#genderDrop").on("change", function(e) {
var gender = $(this).val();
formTable.column(2).search(gender).draw();
});
this works fine, but now I want to be able to remove the filter when the user selects "all" from the dropdown. Here is my attempt:
$("#genderDrop").on("change", function(e) {
var gender = $(this).val();
if (gender != "all") {
formTable.column(2).search(gender).draw();
} else {
formTable.column(2).search("").draw();
}
});
Instead of removing the filter this just searches for an empty string, but I can't work out how to change this so it removes the filter. I also tried:
formTable.column(2).search("*").draw();
and
formTable.column(2).search().draw();
but without any success.
I am using jquery datatables to make my table searchable. I have a dropdown that filters a gender column:
$("#genderDrop").on("change", function(e) {
var gender = $(this).val();
formTable.column(2).search(gender).draw();
});
this works fine, but now I want to be able to remove the filter when the user selects "all" from the dropdown. Here is my attempt:
$("#genderDrop").on("change", function(e) {
var gender = $(this).val();
if (gender != "all") {
formTable.column(2).search(gender).draw();
} else {
formTable.column(2).search("").draw();
}
});
Instead of removing the filter this just searches for an empty string, but I can't work out how to change this so it removes the filter. I also tried:
formTable.column(2).search("*").draw();
and
formTable.column(2).search().draw();
but without any success.
Share Improve this question edited Jan 28, 2015 at 10:29 Shaeldon 8834 gold badges18 silver badges28 bronze badges asked Jan 28, 2015 at 9:47 FinglishFinglish 9,98615 gold badges76 silver badges118 bronze badges3 Answers
Reset to default 3You can use the option All from gender select with empty value:
<option value="">All</option>
them your code will work:
$("#genderDrop").on("change", function(e) {
var gender = $(this).val();
formTable.column(2).search(gender).draw();
});
Using DataTables example as base: http://jsfiddle/PauloSegundo/g15xakh5/
you can try the below:
function fnResetAllFilters() {
var oSettings = oTable.fnSettings();
for (iCol = 0; iCol < oSettings.aoPreSearchCols.length; iCol++) {
oSettings.aoPreSearchCols[iCol].sSearch = '';
}
oTable.fnDraw();
}
To remove all filters and global filters, please refer to below link: https://datatables/plug-ins/api/fnFilterClear
Try this way:
var table = $('#tableHere').DataTable().destroy();
table.state.clear();