I am using jquery datatable. My required is to remove default search box and add custom one in difference place. I use bFilter:false
for remove the search input but it is also disabling search filter functionality. Any Idea how to fix it without using css fiddle
$(document).ready(function(){
var table= $('#example').DataTable({
paging:false,
bFilter:false,
ordering:false
});
$('#search-inp').keyup(function(){
table.search($(this).val()).draw() ;
})
});
$('table'). dataTable({searching: false, paging: false, info: false});
The B is the Buttons extension and it tell DataTables where to put each element in the DOM that it creates.
For Hiding Default Search Input box of Data tables AS:
by default sDom="lftipr";
Perform these operations on datatables
'l' - Length changing
'f' - Filtering input
't' - The table!
'i' - Information
'p' - Pagination
'r' - pRocessing
For removing default search box just remove the f character from sDom.
like:
$('#table').DataTable({
"sDom":"ltipr"
});
Hope this must work
You can use the dom
option to hide the search input without disabling the search functionality. This is useful if you want to provide your own inputs for searching (perhaps on a column by column basis, or globally). It also accomplishes what you asked for initially - remove the original search input without using CSS.
Here is the documentation: https://datatables.net/examples/basic_init/dom.html
And, of course, an example:
var table = $('#example').DataTable({ paging: false, bFilter: false, ordering: false, searching: true, dom: 't' // This shows just the table });
You could also use this method to render the search input in a different place. Depending on where you need to render the input, you may be able to avoid using a custom one altogether.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With