aspose file tools*
The moose likes HTML, CSS and JavaScript and the fly likes AJAX Dynamic Wizard-like Form Problems Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login


Win a copy of Spring in Action this week in the Spring forum!
JavaRanch » Java Forums » Engineering » HTML, CSS and JavaScript
Bookmark "AJAX Dynamic Wizard-like Form Problems" Watch "AJAX Dynamic Wizard-like Form Problems" New topic
Author

AJAX Dynamic Wizard-like Form Problems

Scott McGhee
Greenhorn

Joined: Apr 10, 2007
Posts: 22
Background
- - - - - - - - - - - - - - - - - - -
I am trying to create a form using DHTML which is dynamically created by a servlet. Inside the form there will be any number of html elements, of which may include form elements, javascript, tables, images - all of which are entirely dynamic and will surely change in shape, name, or function.

For simplicity, I am going to reduce the problem to its simplest of components:

+ Master.JSP: hosts the AJAX javascript and DHTML to display the form. The form should be like a "wizard" in a way. Before this page is displayed, an XML is fed into a servlet which will drive the form creation and validation. The javascript will call "script.do" in the background using AJAX which outputs the HTML form - this will include "back" and "next" buttons to display the previous/next form in the sequence. These forms are completely dynamic (form element names are usually autogenerated, and in some cases random!). Submitting a form will not refresh the page, the DHTML is simply updated.

+ script.do (action): This action class (struts) will look for the parameter "action" = ("init", "progress", "rollback") to determine which form to display. It does the following:

1. Inputs the form data
2. Validates the data
3. Does "something" with the data
4. Determines which form to display next
5. Outputs the next form


THE PROBLEM
- - - - - - - - - - - - - - - - - - -
I am having trouble submitting the dynamic form without any knowledge of what form elements exist inside the form. Is there a way to dynamically cycle through all of the form-elements given only the ID of the form?

For example - it would be really great if there was a method with a signature like this:



So that if I do this:



The variable theURL will be "script.do?param1=val1&param2=val2...."

Note: the dynamic form "myForm" would be created by script.do, and would contain any number of form elements. I'd really just want the URL which would show up in the Address Bar if i were to click "submit" on the form and perform an overall page "GET" action on the form. But since I don't want to refresh the page - that is not an option.

I have code snippets for my "first stab" at this problem - but it doesn't work. I can put the code as a reply to this post (if necessary).
[ April 24, 2007: Message edited by: Scott McGhee ]
Gregg Bolinger
GenRocket Founder
Ranch Hand

Joined: Jul 11, 2001
Posts: 15299
    
    6

If you were to use prototype there is a Form.serialize(formId) function that returns a string of query params as you are wanting.

http://www.prototypejs.org/api/form/serialize


GenRocket - Experts at Building Test Data
Scott McGhee
Greenhorn

Joined: Apr 10, 2007
Posts: 22
SWEET. This worked right away. Thanks for the help!

My dynamic wizards will be flying around in no time baby...
 
I agree. Here's the link: http://aspose.com/file-tools
 
subject: AJAX Dynamic Wizard-like Form Problems