forgot to mention, there is a dialog.('destroy') method but it only
removes the ui created class structure wrapping the #dialog, so that
doesn't help, you would still end up with multiple div's with same ID
unless you remove the orignal one each time from body or change the way
you bring markup into the page
one way to avoid this is to reuse same dialog and instead of bringing
new dialog markup with same ID into page each click, just load into the
dialog and empty it on close
Charlie wrote:
look in Firebug at
the html inspector each step
the dialog you create first time gets appended to the body by UI
script. The load function will overwrite the contents of div being
loaded but doesn't remove the dialog from body. The reload is appending
dialog again to body with same ID as first one
two dialogs with same ID is the problem
for some reason $(".ui-dialog").remove(); doesn't remove the #dialog
inside the dialog containers created by UI, it only removes the outer
UI created divs
changing your click function to:
$("#tree li").click(function(event) {
$(".ui-dialog").remove();
$("#dialog").remove();
$("#right").load("data.html", null);
});
it may not be the best approach to the whole process of loading and
unloading of the dialog markup and script but it works
Desperate wrote:
Hi,
I'm facing a strange behaviour of JQuery UI Tabs component; I wish to
describe my scenario before the problem so be patient (thank you): my
application has only one "main" page styled as two columns layout
(here I'm including each JQuery, third party libraries and style
sheets); the left column shows a dynatree while the right is initially
empty. When a tree node is activated, a $("#right-column")load(...)
injects some HTML code in the right column using AJAX. The injected
code contains a data table, another div to use as JQuery dialog
containing a form to be divided in JQUery tabs and a $(document).ready
(...) function to initialise dialog, tabs and bind a double click
event on each data table row to open the dialog.
Now comes the behaviour; When the page loads for the very first time,
everythings works fine: I can select a node from the dynatree and the
data table shows on the right, now a double click on a row open the
dialog showing the tabs, fully functional. Good! The worse happens
when I "switch" to another tree node: the data table shows as expected
and so does the dialog when I click on a row but the tabs inside
aren't; It seems like tabs aren't initialised at all because the plain
HTML is shown instead. Switching again to the previous node doesn't
help because tabs aren't shown anymore.
Any tricks, suggestion or solution is really appreciated.
Thank you
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups "jQuery UI" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to [email protected]
For more options, visit this group at http://groups.google.com/group/jquery-ui?hl=en
-~----------~----~----~----~------~----~------~--~---
|
