Hey Scott, Thanks for the reply! Since I posted this thread, I have found out that jQuery UI Dialog takes the indicated <div> and removes it from its place within the HTML and moves it to the end of the <body> element. This might seem okay for some, however we have a <form> setup immediately within the <body> element, so the form fields in the modal dialog will not be a part of the POST submission.
Thoughts? =\ Thanks!! On Apr 2, 2:42 pm, Scott González <[email protected]> wrote: > Untested, but this should work: > > $('.boxButton').each(function() { > var dialog = $(this).next('.boxDialog').dialog({ > autoOpen: false, > bgiframe: true, > modal: true > }); > > $(this).click(function() { > dialog.dialog('open'); > }); > > }); > > On Apr 2, 2:58 pm, Andrew <[email protected]> wrote: > > > ENVIRONMENT: jQuery 1.3.2, jQuery UI 1.7.1 Core + Dialog > > > I have been trying to create some generic jQuery preparation functions > > that would setup buttons to open different modal dialog boxes on a > > page. Rather than hard coding the logic or dynamically generating the > > necessary logic, I thought I came up with a clever way. > > > I have an element with the class "boxParent" which contains a <div> > > with the class "boxDialog". The "boxParent" element will also contain > > a button with the class of "boxButton". Whenever the "boxButton" is > > clicked, I want to open the "boxDialog" contained within the same > > "boxParent". I planned on doing this by traversing up to "boxButton" > > parent with the "boxParent" class and then find its child with > > "boxDialog". Everything was working up to the part of finding > > "boxDialog" and I stumbled upon why. > > > Whenever I tried to find my <div> as a child of its container, it > > seems it was removed from the inner HTML all together. This explains > > why my logic could not find it. However, I still want to tie together > > dialogs and buttons relationally rather than hard code or dynamically > > create logic to prepare them. > > > Could anyone give a hand? Thanks! > > Andrew > > > <?xml version="1.0" encoding="UTF-8" ?> > > <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" > > "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd";> > > <html xmlns="http://www.w3.org/1999/xhtml"; xml:lang="en" lang="en"> > > <head> > > <script type="text/javascript" > > src="jquery-1.3.2.min.js"></script> > > <script type="text/javascript" > > src="jquery-ui-1.7.1.custom.min.js"></script> > > <link type="text/css" > > href="smoothness/jquery-ui-1.7.1.custom.css" > > rel="Stylesheet" /> > > <script type="text/javascript"> > > > $(function() { > > > $('.boxParent').each(function() { > > alert("Pre-Dialog Box Parent > > HTML: " + $(this).html()); > > }); > > > $('.boxDialog').each(function() { > > $(this).dialog({ bgiframe: > > true, autoOpen: false, modal: true }); > > }); > > > $('.boxParent').each(function() { > > alert("Post-Dialog Box Parent > > HTML: " + $(this).html()); > > }); > > }); > > > </script> > > </head> > > <body> > > <form> > > <table> > > <tr> > > <td>SOME DESCRIPTION:</td> > > <td class="boxParent"> > > <button type="button" > > class="boxButton">Should open dialog in parent</buton> > > <div class="boxDialog" > > title="Sample dialog box"> > > This is a > > random dialog box that should show up as a > > child of > > boxParent > > </div> > > </td> > > </tr> > > <tr> > > <td>SOME DESCRIPTION:</td> > > <td class="boxParent"> > > <button type="button" > > class="boxButton">Should open dialog in parent</buton> > > <div class="boxDialog" > > title="Sample dialog box"> > > This is ALSO a > > random dialog box that should show up > > as a child of > > boxParent > > </div> > > </td> > > </tr> > > </table> > > </form> > > </body> > > </html> --~--~---------~--~----~------------~-------~--~----~ 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 -~----------~----~----~----~------~----~------~--~---
