JQuery DataTable: recherche de colonne individuelle sur l'en-tête de table

J'ai suivi les étapes de la recherche de colonne individuelle (entrées de texte) et la recherche de colonne individuelle (sélectionner des entrées) pour utiliser plusieurs filtres sur jQuery DataTable et il existe plusieurs filtres sur le pied de page. D'autre part, je souhaite déplacer ces filtres vers l'en-tête du DataTable, mais je ne peux pas les aligner horizontalement comme indiqué sur l'image ci-dessous. Il existe des exemples de filtrage personnalisé – recherche de portée , mais ils ne sont pas également alignés. Est-il possible de faire cela?

$(document).ready(function() { // Setup - add a text input to each footer cell $('#example tfoot th').each( function () { var title = $(this).text(); $(this).html( '<input type="text" placeholder="Search '+title+'" />' ); } ); // DataTable var table = $('#example').DataTable(); // Apply the search table.columns().every( function () { var that = this; $( 'input', this.footer() ).on( 'keyup change', function () { if ( that.search() !== this.value ) { that .search( this.value ) .draw(); } } ); } ); } ); 

• JQuery Datatables recherche en entrée et sélectionnez
• Comment recharger / actualiser jQuery dataTable?