Multiple sets of headers and footers appearing when redrawing table content

I have a table, that shows a filtered set of data (data generated server side, and whole page returned to client(). Datatables is overlaid on top and works great (attached to the markup ID of the <table>). If the user selects to see all the data (via a checkbox), I issue an Ajax request back to the server and the new table is re-rendered with all the data (same markup ID), but I end up with 2 sets of Datatables headers and footers so in the footer I see something like:

Showing 1 to 8 of 8 Entries
Showing 1 to 1 of 1 Entries

I get a new set of headers and footers for every Ajax request/re-render.

I am not loading the data via JSON - merely generating the table server side, and then sending back the HTML + JS to the client, where upon arrival, the DataTables init() code fires and sets itself up. It looks like I need to cleanup from the first render, but I dont know if this is possible?

Regards

Nick