gerd
4/13/2017 - 4:31 PM

Searchable columns - dataTables From https://datatables.net/forums/discussion/33182/individual-column-searching-with-statesave-not-showing-p

$(document).ready(function () {
        // Setup - add a text input to each footer cell
        $('#example tfoot th').each(function () {
            var title = $('#example thead th').eq($(this).index()).text();
 
            if (title != "") {
                $(this).html('<input type="text" style="font-style:italic;font-size:xx-small;color:lightgray;" placeholder="Search ' + title + '" />');
            }
        });
 
        // DataTable
        var table = $('#example').DataTable({
            "order": [[1, "desc"]],
            "lengthMenu": [[10, 25, 50, 100, -1], [10, 25, 50, 100, "All"]],
            "columnDefs": [{ "targets": 0, "orderable": false, "searching": false }],
            "stateSave": true
        });
 
        // Restore state
        var state = table.state.loaded();
        if (state) {
            table.columns().eq(0).each(function (colIdx) {
                var colSearch = state.columns[colIdx].search;
 
                if (colSearch.search) {
                    $('input', table.column(colIdx).footer()).val(colSearch.search);
                }
            });
 
            table.draw();
        }
 
 
        // Apply the search
        table.columns().eq(0).each(function (colIdx) {
            $('input', table.column(colIdx).footer()).on('keyup change', function () {
                table
                    .column(colIdx)
                    .search(this.value)
                    .draw();
            });
        });
    });