How to get value entered in search box In Datatables

Question

How to get value entered in search box In Datatables. Is there a way to get value entered in search box in Data Tables?

Answer 1

you can do something like this works for all datatable version what we are doing here is tracking the search input field and then getting its value only no need to use datatable api using this method

$('input[type="search"]').on( 'keyup', function () {
            console.log($(this).val());
} );

Answer 2

Yes, there is. You call the search method without an argument to get the search term

var query = dataTable.search()

https://datatables.net/reference/api/search()

Get the currently applied global search. If there is more than one table in the API's context, the search term of the first table will be returned. Use table() if you require the search term of a different table in the API's context.

Answer 3

As mentioned in dataTable api

    var table = $('.datatable').DataTable();


     $('.datatable').on('search.dt', function (e, settings) {
       table.search( this.value ).draw();
    })

    //or custom input
    // #myInput is a <input type="text" id="myInput"> element
    $('#myInput').on( 'keyup', function () {
        table.search( this.value ).draw();
    });

Answer 4

If you just want to check the value when a search is performed [dataTables 1.10.x] :

var table = $('#example').DataTable();

$('#example').on('search.dt', function() {
    var value = $('.dataTables_filter input').val();
    console.log(value); // <-- the value
}); 

if you want to check the value before the search, and be able to cancel the search, you must unbind the default searchbox event and create your own, like this - search only when the user has entered more than 3 characters :

$('.dataTables_filter input').unbind().keyup(function() {
    var value = $(this).val();
    if (value.length>3) {
        table.search(value).draw();
    } 
});

demo -> http://jsfiddle.net/pb0632c3/

To reset the search / filter completely, like if the user has deleted the search term :

if (value.length==0) table.search('').draw();

Answer 5

Try this function to detect the key press and then draw the DataTablee.

$('#search').on('keyup change', function () {
    var table = $('#example').DataTable();
    table.api().search($(this).val()).draw();
});