Resetting Column Select Filters
Resetting Column Select Filters
Hi,
I am using a table with both text search and dropdown select filters on the columns in the table header row.
Everything is working fine, i.e. it displays correctly and filters according to the search text I enter or selected value from the dropdown lists on the other columns.
I am clearing the search text filters and resetting the table using the following code which is triggered by the user clicking on a "Reset" button I have added to the buttons extension ribbon bar above my table.
{ text: 'Reset',
className:'btn btn-reset btn-sm',
header: true,
action: function ( e, dt, node, config ) {
$("input[type='text']").each(function () {
$(this).val('');
})
dt.columns().every( function () {
var column = this;
column
.search( '' )
.draw();
} );
dt.search('').draw();
dt.order( [ 0, 'desc' ] )
dt.draw();
}
},
As I said this is working fine, however I also need to reset the dropdown selects to the first value in each dropdown which is empty but I cannot work out how to do it.
For example if I have selected a dropdown in one of the columns and also selected a value from one of the dropdown select boxes, when I click on reset the table is refreshed and any text I have entered into the column search boxes is cleared but the dropdown(s) still show the value I selected prior to refreshing the table and clearing the text boxes.
I hope this makes sense.
As always, keep up the good work we are all in your debt.
Alan
Answers
We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.
Cheers,
Colin