Directly adding footer in JQuery DataTable

Question

I want to directly add a footer to a JQuery datatable, just like I would for the body of the table using the dt.row.add() method. How is this possible without using the footer callback method?

Thanks.

Answer 1

DataTables doesn't seem to have a API to add a footer dynamically, if that's what you want. It checks for presence of <tfoot> element during initialization only.

To add a footer dynamically:

1. Destroy the table with destroy().

   $('#example').DataTable().destroy();

2. Append <tfoot><tr><th></th></tr></tfoot> to the <table> element making sure you're adding as many <th></th> elements as there are columns in the table.

3. Re-initialize the table with the same options:

   $('#example').DataTable({ /* your options here */ });