How to cleanup datatables in Single page apps

d4kris

I am writing a single page app using Backbone where I have many different search results pages that are replaced by details. When the result page is replaced I would like to cleanup the datatables instance properly and have used fnDestroy(true) for this. But I see when debugging that fnDestroy does a lot more than just deallocate any resources and here I have a problem.

I get an error in IE9 and IE10 (remarkably not in IE8) on line 5454 stating that oSettings.nTable.parentNode is null or undefined:
oSettings.nTable.parentNode.removeChild( oSettings.nTable );
(Pasting the error for searchability: "Unable to get property 'removeChild' of undefined or null reference")

After a lot of debugging I have realised that the call to destroy is done after the table dom is detached, the whole table DOM is thrown away when we create the next page. Here is a boiled down example of the problem:
http://live.datatables.net/obecap
Clicking the Close button will replace the table and trigger the error.

I guess the easy answer is to call fnDestroy before the dom is detached, but I'm afraid that I am using a region manager that calls a close method a bit too late. I will try and workaround this by calling the fnDestroy manually before switching pages, but I think the functionality really belongs in a close or cleanup method.

So apart from the error, I have a larger question:
What is the best way to clean up an instance of datatables attached to a table element that is destined for the garbage bin?

Thanks for an impressively capable and robust plugin, it is really lifting our application.
BR
/Kris