Column filter input triggering resort

allanmacritchie

I have successfully implemented column filtering using Datatables.net using the example code on the site, but on clicking on an input field the table reorder function initiates, how can I stop this?

colin

This thread should help, it's asking the same thing.

Cheers,

Colin

allanmacritchie

Thanks Colin, have added orderCellsTop: true, already and it doesn't seem to be working.

allanmacritchie

``` var table = $('#dataTable').DataTable(
// Amended to apply options
{
fixedHeader: true,
orderCellsTop: true,
paging: true,
select: {
className: 'row-selected',
info: true,
items: 'cells',
style: 'os',
},
}
);
// Column specific filtering code
// Setup - add a text input to each footer cell
$('#dataTable thead tr').clone(true).appendTo('#dataTable thead');
$('#dataTable thead tr:eq(1) th').removeClass('sorting_asc').removeClass('sorting_dec').removeClass('sorting').each(function (i) {
var title = $(this).text().trim();
$(this).html( '<input class="form-control" type="text" placeholder="Search '+ title+'" />' );

                $( 'input', this ).on( 'keyup change', function () {
                    if ( table.column(i).search() !== this.value ) {
                        table
                            .column(i)
                            .search( this.value )
                            .draw();
                    }
                } );
            } );```

kthorngren

There are lots of threads with this question like this one. Take a look at the example provided to see how to add the search inputs to the second header row.

Kevin