I have several columns in my datatable that use the select inputs dropdowns. I used searchcols to force three of those columns to choose a default value. This works in theory; however, even though that value is searched, the dropdown displays the blank (or 'all') option and doesn't actually select the intended value - it's just running a search in that column. This has multiple user problems. How can I make it so the intended value is selected by default? Additionally, can I select multiple inputs on page load, or will I need a plugin for that? Here's my code:
initComplete: function () {
this.api().columns([3,4,5,6,14,15,16,17]).every( function () {
var column = this;
var select = $('<select><option value=""></option></select>')
.appendTo( $(column.header()).empty() )
.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>' )
} );
} );
},
"searchCols": [
null,
null,
null,
null,
null,
null,
null,
null,
null,
null,
null,
null,
null,
null,
{ "search": "N", "escapeRegex": false },
null,
{ "search": "B", "escapeRegex": false },
{ "search": "75", "escapeRegex": false },
]