Skip to main content

Search and Top Navigation

#7601 closed bug (notabug)

Opened August 03, 2011 06:17AM UTC

Closed August 03, 2011 12:20PM UTC

jQuery UI Dialog allows duplicate dialogs when used with dynamic content

Reported by: laxu Owned by:
Priority: minor Milestone: 1.9.0
Component: ui.dialog Version: 1.8.14
Keywords: Cc:
Blocked by: Blocking:
Description

Steps to reproduce:

1. You need link a#myLink that uses .load to load a file (e.g. test.html) into div#myContainer

2. test.html contains:

<script type="text/javascript">
$(document).ready(function() {
   $('#myDialog').dialog({ autoOpen:false });
});
</script>
<div id="myDialog">This is a dialog.</div>

3. Use link to load test.html into #myContainer

4. Now click link again. Now you've got two dialog elements.

The problem is that when you load the content, it creates a dialog into html body, outside the #myContainer div. Thus when you load the same content again jQuery UI thinks that the element #myDialog does not have a dialog yet. Thus you end up with dialog elements getting stacked into the body and never cleared.

A workaround is using $('#myDialog').dialog('destroy').remove() outside docready before the content is processed.

Still, since dialogs should not duplicate it seems like a bug in how the dialog is handled. Perhaps it should look first for an existing dialog in the html body and only then apply a new one?

Attachments (0)
Change History (2)

Changed August 03, 2011 07:10AM UTC by laxu comment:1

_comment0: Correction: The workaround is $('#myDialog','.ui-dialog').remove()1312355469176724

Correction: The workaround is $('#myDialog','.ui-dialog').remove() inside docready

Changed August 03, 2011 12:20PM UTC by rdworth comment:2

resolution: → invalid
status: newclosed

When you call .dialog() on an element it will wrap the element and move the wrapper to the end of the body. This is as designed (not a bug) and is required in order to display the dialog correctly (on top) in all instances. If you have application code that isn't aware that this happens and doesn't deal well with it, your code needs to be changed to account for this behavior.