Refreshing the whole jQuery mobile dialog programatically

Refreshing the whole jQuery mobile dialog programatically

I am developing a mobile application with jQuery mobile and backbone. I have backbone model change event function, if any changes in the model, I simply destroy the whole page and recreate with template binding. i use$('#pageId').page('destroy').page(); which works fine.

I want to do the samething for dialog (just destory the dialog and recreate the dialog and display it). Can you anyone tell me the right method to call.... I just tried with .dialog() but i didn't work.. thanks in advance.

my dialog code.

<div data-role="dialog" id="myDialog" data-close-btn="right"> <div data-role="header" class="ui-corner-top"> <h1>dialog</h1> </div> <div data-role="content"> <form id="myForm"> <fieldset> <label for="fromDate">Date From</label> <input id="fromDate" type="date" required placeholder="mm/dd/yyyy"> </fieldset> <fieldset> <label for="toDate">Date To</label> <input id="toDate" type="date" required placeholder="mm/dd/yyyy"> </fieldset> <input type="submit" value="submit" id="btnSubmit" data-inline="true" /> </form> </div> </div>