1. Technology

Multiple Page Forms

HTML Forms Tutorial


Multiple page forms are difficult because of how the web works. Every time you come to a new web page, your web browser starts over from scratch. All information from previous pages is forgotten, unless you do something to save it. This is called "saving state."

In order to write a multi-page HTML form, you need to save the answers from the first, second, etc. pages to submit to the server when you get to the last page.

The Trick to Multiple-Page Forms

The trick to creating multiple page forms is to use hidden fields. The hidden input tag is a valuable tool for developers who want to create forms with many pages, and not write the data until the end.

You just need to make sure that all your form entry fields have different names. Then, when you use a hidden field on the second and subsequent pages, you can use the same name as you gave it on the first page.

  1. Collect the form data as you normally would (using input, select, and textarea tags). For this example, we'll input a text tag with the name first_name, and the value Jennifer.
  2. When the submit button is pressed, have your script do any processing required on the data, and then write page 2 using the script (print or printf in Perl and C).
  3. Within the second (and subsequent) page of the form, have your script write the currently submitted data as the values of hidden tags. There was only one field input, and so my script would write:
    <input type="hidden" name="first_name" value="Jennifer">
    In a Perl script, this might look something like:
    my $first_name = $in{'first_name'};
    print "<input type="hidden" name="first_name" value="$first_name">";

This article is part of the HTML Forms Tutorial

©2014 About.com. All rights reserved.