How to remove all jQuery UI dialog box when it is closed

On my main page, I have a kind of sidebar that you can open and close. The sidebar is loaded via the jQuery download function in the div on the main page.

Some of the content loaded into this sidebar is a div (myDialog)

When a button is pressed on this sidebar, I call:

$("#myDialog").dialog({
  title : "Permission",
  width : 300,
  height : 200,
  modal : true
});

Now, if I close the sidebar and clear its contents using the jQuery empty function. Then I select all and the 'view source' html, which is added by jQuery at the bottom of the body. This causes problems when I open the sidebar again and try to open the same dialog, because there are two of this div (with duplicate identifiers).

I tried to add this, but it does not work:

close : function(){
    $("#myDialog").dialog("destroy");
}

html, jQuery ? , ?

+2
5

jQueryUI div DOM , . , empty() , .

div, , (, ).

+3

. jquery: .

$(this).dialog('destroy').remove()
+4

DOM. close :

$('#myDialog').dialog("destroy").remove();
+1
source

when you close the dialog then it closes the window but the content will not be cleared .. and if you use

$(this).dialog('destroy').remove()

then it will remove the dialog from the DOM, so you need to clear all the content yourself. or when you reopen the dialog you need to clear all the data

like this ... try ...

+1
source

Does it work $("#myDialog").dialog("close")?

Also possible $('#myDialog').dialog("destroy").remove().

Otherwise, you are not using a class instead of an identifier. So duplicates don't matter.

0
source

All Articles