Display default select inputs properly

dsmithTek

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 },
                  ]

ACosta123

Hello all,

I have the same problem, and would like to know how to make the intended search value show up in the dropdown so user knows that the table is displaying that search option as default?

or is there a different method to do this?

kthorngren

You can use column().search() to get the current search term and set the option as selected if it matches the current search. For example:
http://live.datatables.net/hunaxesu/1/edit

Kevin

ACosta123

Thanks Kevin for the quick replay and excellent help