CODEWITHSUNDEEP
datatables
hereForLearing
hereForLearing

Reputation: 1288

How to add my own search input ? [datatables]

I'm wondering if it's possible to add my own search inputs (not in the footer, because this make responsive plugin not working well), so I would like to add some search inputs (outside of the table tag) to search by column and another one to search in all columns.
Thank you

Upvotes: 0

Views: 379

Answers (1)

Gyrocode.com
Gyrocode.com

Reputation: 58880

See search API example for code and demonstration on how to implement the search input outside of the table.

Sample code from the demo:

function filterGlobal () {
    $('#example').DataTable().search(
        $('#global_filter').val(),
        $('#global_regex').prop('checked'),
        $('#global_smart').prop('checked')
    ).draw();
}

function filterColumn ( i ) {
    $('#example').DataTable().column( i ).search(
        $('#col'+i+'_filter').val(),
        $('#col'+i+'_regex').prop('checked'),
        $('#col'+i+'_smart').prop('checked')
    ).draw();
}

$(document).ready(function() {
    $('#example').DataTable();

    $('input.global_filter').on( 'keyup click', function () {
        filterGlobal();
    } );

    $('input.column_filter').on( 'keyup click', function () {
        filterColumn( $(this).parents('tr').attr('data-column') );
    } );
} );

Upvotes: 1

Related Questions