This is in continuation of the PHP multi-page order form article. The first paged explained how to pass the variables between pages using sessions. This page shows you how to accomplish the same using hidden fields.
Multi-page forms using hidden input fields
Hidden input fields are form fields that are not visible. The user can't see or change these fields, and they are used to transmit state information between different pages. Let's use hidden fields to transport our data across our form, to the final processing script.
We start with the same form for step 1:
<form method="post" action="form2.php"> <input type="text" name="name"> <input type="text" name="email_address"> <input type="submit" value="Go To Step 2"> </form>
Ok, so nothing more than 2 input fields and a submit button to take us to step 2. In the following page, apart from the HTML form to gather membership data, we are going to need code to store the submitted data from step 1 in the session.
<form method="post" action="form3.php"> <input type="radio" group="membership_type" value="Free"> <input type="radio" group="membership_type" value="Normal"> <input type="radio" group="membership_type" value="Deluxe"> <input type="checkbox" name="terms_and_conditions"> <input type="hidden" name="name" value="<?php echo $_POST['name']; ?>"> <input type="hidden" name="email_address" value="<?php echo $_POST['email_address']; ?>"> <input type="submit" value="Go To Step 3"> </form>
Please note that although the hidden fields are not visible to the visitor, they are visible in source of the page, so you must not use them to store critical information.
Now our form contains all the data entered so far, which we are going to post to the third part of the form.
<form method="post" action="form_process.php"> <input type="text" name="name_on_card"> <input type="text" name="credit_card_number"> <input type="text" name="credit_card_expiration_date"> <input type="hidden" name="name" value="<?php echo $_POST['name']; ?>"> <input type="hidden" name="email_address" value="<?php echo $_POST['email_address']; <input type="hidden" name="membership_type" value="<?php echo $_POST['membership_type']; ?>"> <input type="hidden" name="terms_and_conditions" value="<?php echo $_POST['terms_and_conditions]; ?>"> <input type="submit" value="Finish"> </form>
Now that we have all our fields available, let's proceed to the form processing.
<?php
//let's create the query
$insert_query = "insert into subscriptions (".
"name,".
"email_address,".
"membership_type".
"terms_and_conditions,".
"name_on_card,".
"credit_card_number,".
"credit_card_expiration_data".
") values (".
"'" . $_POST['name'] . "', ".
"'" . $_POST['email_address'] . "',".
"'" . $_POST['membership_type'] . "',".
"'" . $_POST['terms_and_conditions'] . "',".
"'" . $_POST['name_on_card'] . "',".
"'" . $_POST['credit_card_number'] . "',".
"'" . $_POST['credit_card_expiration'] ."' )";
//let's run the query
mysql_query($insert_query);
?>And that's it. Please note that this time, we have all the data available in the $_POST array.
A good idea would be to use form validation for each step of the form, so you don't end up with incomplete data in the database.
Now you know two methods of creating multipart forms, to create better user-experience for your visitors.
Related posts:
{ 2 comments… read them below or add one }
Hi:
I have a stupid question.
I am using FormtoEmail.php and Macromedia Dreamweaver to create a multi-page form.
Of coure, I have to put form pages on Web pages.
I would like to know how to link the Web pages so that users can go to the next forms
from the first one.
Thank you very much in advance for your answer.
Use switch case. Every time you click submit (do something) then i++ reload the page which will cause the script go to the next case, (do something) and so on.