wizard form

hello. I have a form divided into sections like wizard, where the next and back buttons are defined in javascript.

What I´m intended to do is something like this example.


I’ve got my form and I have divided into five tabs.

The four Initial tabs have the inputs and those inputs should be shown in fifth tab.
What I needed is that the next button on the fourth tab was associated with two functions:

1 - … action = “form.php” and form.php is the same file I’m using.

2 - After the action should proceed to the last tab that already has the php code to display the information contained in the inputs

What is happening now is that I have added a submit button on the fourth tab and run the form.php not going to the fifth tab but to the beginning.
I did not want to add the submit button but instead use the default button next.


This can be done in javascript as well. When you put your submit button in the fourth tab and you click it, it’s reloading the page and having javascript start over again. Now I don’t know if you want all the information stored after the fourth tab is done and then display the result on the fifth tab or if you want to display everything from the first four tabs on the fifth tab before you submit everything.

You can obtain user’s information in the first four tabs and display the information on the fifth without submitting anything by using the javascript’s value function to display the values of all fields of your forms. Say you have your forms: Form1, Form2, Form3, Form4 and you have specific fields on each of them. On the fifth field, you can call all those values by adding: document.<form_name>.<field_name>.value to your script. Then you can display something like this for your fifth tab:

Name: javascript:document.Form1.name.value;<br>
Email: javascript:document.Form2.email.value;<br>
City: javascript:document.Form3.city.value;<br>
State: javascript:document.Form4.state.value;

Now I hardly use this kind of scripting so the code might be off a little bit but I hope you get the idea. Here’s a website that explains how this type of thing works: http://www.javascript-coder.com/javascript-form/javascript-forms-get-all-form-objects.htm. Just google “javascript forms” and it can give you more information. I hope this helps you =D.

hello! Thank you.
I have not explained myself well. On the fifth tab will not show only the information contained in the first four tabs. I also have math operators using the values entered in the first four tabs and I need to submit to run the calculations. By submitting should go to the fifth tab because I have already programmed to display the results. But submitting the page is reload and go to the first tab.

How can I do this?

Are you using the code from the website or have you created your own code? I want to assist you but I don’t want to reference something you are not using.

Hi. I´m using the javascript code from the website.

Sponsor our Newsletter | Privacy Policy | Terms of Service