Search stopped working when using javascript data source

gizmojo

https://jsfiddle.net/pad5xgn7/2/

My datatable has grown so big that the initial load of html causes the browse to crash on old mobile phones. So I've moved to use javascript array as data and working really well.

Problem is that now the search has stopped working like it did before.

I have to hide the standard search so that I can change the location (jsfiddle is simplified for demo) otherwise when I called table.columns().search(this.value).draw() nothing happened.

$(document).ready(function() {
    let dataTable = $('#example').DataTable( {
        data: dataSet,
        columns: [
            { title: "Name" },
            { title: "Position" },
            { title: "Office" },
            { title: "Extn." },
            { title: "Start date" },
            { title: "Salary" }
        ]
    } );
    
    $('input[type=search]').on('keyup', function () {
      dataTable.columns().search(this.value).draw();
    })
} );

kthorngren

I think you want to use the search() API instead of the columns().search() API. See the updated example:
https://jsfiddle.net/3ysh9wa0/

Kevin

gizmojo

Wow thank you that worked and makes sense now.