Building off of Nicola’s answer, you can use the fnDrawCallback() callback and the oSettings object to hide the table pagination after it’s been drawn. With oSettings, you don’t need to know anything about the table settings (records per page, selectors specific to the table, etc.) The following checks to see if the per-page display length … Read more
Don’t forget to change the iDisplayLength as well: $(document).ready(function() { $(‘#tbl_id’).dataTable({ “aLengthMenu”: [[25, 50, 75, -1], [25, 50, 75, “All”]], “iDisplayLength”: 25 }); } );
What is happening is that DataTables is setting the CSS width of the table when it is initialised to a calculated value – that value is in pixels, hence why it won’t resize with your dragging. The reason it does this is to stop the table and the columns (the column widths are also set) … Read more
You have to first clear the table and then add new data using row.add() function. At last step adjust also column size so that table renders correctly. $(‘#upload-new-data’).on(‘click’, function () { datatable.clear().draw(); datatable.rows.add(NewlyCreatedData); // Add new data datatable.columns.adjust().draw(); // Redraw the DataTable }); Also if you want to find a mapping between old and new … Read more
Hide columns dynamically The previous answers are using legacy DataTables syntax. In v 1.10+, you can use column().visible(): var dt = $(‘#example’).DataTable(); //hide the first column dt.column(0).visible(false); To hide multiple columns, columns().visible() can be used: var dt = $(‘#example’).DataTable(); //hide the second and third columns dt.columns([1,2]).visible(false); Here is a Fiddle Demo. Hide columns when the … Read more
If you want to customize the message that being shown on empty table use this: $(‘#example’).dataTable( { “oLanguage”: { “sEmptyTable”: “My Custom Message On Empty Table” } } ); Since Datatable 1.10 you can do the following: $(‘#example’).DataTable( { “language”: { “emptyTable”: “My Custom Message On Empty Table” } } ); For the complete availble … Read more
Try adding “bDestroy”: true to the options object literal, e.g. $(‘#dataTable’).dataTable({ … …. “bDestroy”: true }); Source: iodocs.com or Remove the first: $(document).ready(function() { $(‘#example’).dataTable(); } ); In your case is the best option vjk.
The aoColumnDefs’ aTargets parameter lets you give indexes offset from the right (use a negative number) as well as from the left. So you could do: aoColumnDefs: [ { bSortable: false, aTargets: [ -1 ] } ] The equivalent new API (for DataTables 1.10+) would be: columnDefs: [ { orderable: false, targets: -1 } ]
Use: $(‘#example’).dataTable({ aLengthMenu: [ [25, 50, 100, 200, -1], [25, 50, 100, 200, “All”] ], iDisplayLength: -1 }); Or if using 1.10+ $(‘#example’).dataTable({ paging: false });
Solution for version 1.10 – After looking here for a complete answer and not finding one, I’ve written this (utilizing code from the documentation, and a few answers here). The below code works to delay searching until at least 3 characters are entered: // Call datatables, and return the API to the variable for use … Read more