after dropdown added to column header, select one by default
after dropdown added to column header, select one by default
chris.cavage
Posts: 46Questions: 12Answers: 0
in DataTables
I am adding a dropdown menu dynamially to the fourth column in fnInitComplete so users can filter easier like this:
"fnInitComplete": function(settings, json) {
this.api().columns(3).every(function () {
var column = this;
var select = $('<select class="form-control"><option value=""></option></select>')
.appendTo($(column.header()))
.on('change', function () {
var val = $.fn.dataTable.util.escapeRegex(
$(this).val()
);
column
.search(val ? '^' + val + '$' : '', true, false)
.draw();
});
column.data().unique().sort().each(function (d, j) {
select.append('<option value="' + d + '">' + d + '</option>')
});
});
}});
The column that has the dropdown menu only has options of Yes or No.
Once it's loaded, how can I select the menu item of 'Yes' by default?
This question has an accepted answers - jump to answer
This discussion has been closed.
Answers
You can use jQuery to change the select val() with
.change()
to invoke the event handler. The event handler will then perform the search. Something like this:Here is an example using your code:
http://live.datatables.net/sodaqeva/1/edit
Kevin
Thank you!