Zweni Nkabinde free commented 4 years ago

Hi Shashank. You need to do the following in your table initialisation:

$(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(); $(this).html( '' ); } );

// DataTable
var table = $('#example').DataTable( {
    colReorder: true
} );

// Apply the filter
$("#example tfoot input").on( 'keyup change', function () {
    table
        .column( $(this).parent().index()+':visible' )
        .search( this.value )
        .draw();
} );

} );

I think column filtering is a paid-for feature in mdbootstrap. But if you add the above code, it will work the same as the original Datatables implementation