homepage Welcome to WebmasterWorld Guest from 54.204.249.184
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member
Visit PubCon.com
Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
Forum Library, Charter, Moderator: open

JavaScript and AJAX Forum

    
jQueryUI Dialog Box with Form
IntegrityWebDev




msg:4326064
 5:53 pm on Jun 14, 2011 (gmt 0)

I'm still pretty much a JS noob and especially at jQuery, but I did manage to get a jQueryUI Dialog box working with this code:

<script>
jQuery(function() {
$( "#dialog" ).dialog({ closeOnEscape: true, modal: true, draggable: false, resizable: false, width: 500, height: 500, close: function(event, ui) { location.href = 'http://www.page.com' } });
});
</script>
<div id="dialog" title="WELCOME!">
<form id="wp_signup_form" action="" method="post">
<label>Email address</label><br />
<input type="text" name="email" class="text" value="" /> <br />
<input type="submit" id="submitbtn" name="submit" value="SignUp" />
</form>
</div>


But when I click submit on the form the whole page reloads inside the modal window.

How do either get just the modal window to reload with the form content in it, or reload the whole window with info I will be populating via PHP?

Thanks!
Chris

 

daveVk




msg:4327321
 1:27 pm on Jun 17, 2011 (gmt 0)

action=""

needs to be

action="/processFormDataAndGetDialogContent.php"

It may be convenient to use the same url (php) you used to load the dialog with initially.

IntegrityWebDev




msg:4327362
 2:09 pm on Jun 17, 2011 (gmt 0)

The page calls a PHP function and the entire modal window is in that function...even if I change that action to another site completely (google) it reloads the current site inside of the modal window. I also have a target = "_top" in there and that doesn't help.

I am not a JS/jQuery person but after doing some reading on forms processing in a jQuery UI modal window I suspect I'm going to have to rewrite what i've done to allow the processing of the form to be done in jQuery.

IntegrityWebDev




msg:4327526
 7:23 pm on Jun 17, 2011 (gmt 0)

I solved this by embedding an iframe inside my modal, this gets what I need. Thanks for the help!

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved