Javascript codes
<script>
$(document).ready(function(){
let table = $('#kt_datatable').DataTable({
responsive:true,
order: [[0, 'desc']],
columnDefs: [
{
targets: 7,
searchable: false,
orderable: false,
}
],
language: {
'url' : datatable_lang_cdns.{{config('app.locale')}}
},
"dom": 'l<"toolbar">ftip',
initComplete: function () {
this.api().columns([6]).every( function () {
var column = this;
var select = $('<select><option value="">All Role</option><select>')
.appendTo( $('.toolbar').empty() )
.on( 'change', function () {
var val = $.fn.dataTable.util.escapeRegex(
$(this).val()
);
column.search( val ? '^'+val+': '', true, false ).draw();
} );
column.data().unique().sort().each( function ( d, j ) {
select.append( '<option value="'+d+'">'+d+'</option>' )
} );
} );
}
});
});
</script>
Style codes:
<style>
.toolbar{
display: inline-block;
margin-left: 2%;
}
.dataTables_length{
display: inline-block;
}
.dataTables_filter{
display: inline-block;
float: right;
}
</style>