jquery mobile clear the DOM on click

Question

I am creating a small jquery mobile webapp and I've come across an issue with using data-dom-cache='true'. I have this set as the users will do a search and a data-mode='columntoggle' table is loaded with a "select columns" button for responsive design, that holds the search results and then links to new pages. When the users go to the new pages they are able to use the "back" button and because of data-dom-cache='true' the search (form data) is retained and they do not need to re-enter the search criteria and re-submit.

However, this is causing me issues with the column toggle button and any popups on the screen, they simply don't work at all even though the link of the page changes to "contract_List.php#&ui-state=dialog", I assume because these popup id's are already saved in the DOM so the app doesn't know what to do with them?

Please forgive my lack of knowledge on this subject, my question is am I able to trigger the DOM clearing perhaps on submitting a new search or opening specific pages so that I won't have errors with the popups? It also makes sense to me that when the user does a new search that the old search should be removed from the DOM anyway?

Thanks for your help!

Answer 1

I found a very simple solution to this problem. I have set data-ajax='false' for each form that on submit takes the user to a search where I have used data-dom-cache='true'.