JQuery datatables adding custom form elements

Question

I have a dataset with basic init. I want to have checkboxes and a submit button under the table. Is there a way to customize the "row" information below the table?

This is how it looks if I just add a submit button after the table

Here is what I want it to look like

I need a solution in which Javascript is on or off.

Answer 1

Your requirement for a solution that disables Javascript is not possible, because a string of information is generated only when the DataTable is initialized.

The info line is wrapped with a div tag that gets its identifier based on the identifier of the initialized table.

For example, if your table was declared as follows:

<table id='myTable'> </table> 

The info line will appear in your DOM, as this

 <div id='myTable_info' class='dataTables_info'> Showing 1 to 2 of 2 entries </div> 

To add a delete button to your info line, you need to use fnDrawCallback to turn on the button every time a table is displayed.

 $("#myTable").dataTable( { "fnDrawCallback": function() { $("#myTable_info").prepend("<input type='button' value='Remove'>"); } } );