One form spread across multiple pages-CodePudding

I have a sales form on my website, which requires users to enter several pieces of information about themselves.

However, many of the site visitors are either intimidated by the form, or they see it is 'too long'.

In an attempt to try and make the form process more fun, inviting and 'user friendly', I would like to try to spread the form out over several pages, with creative language on each page to help users feel more at ease with sharing their information a bit at a time before submitting the form.

I dramatically scaled back the form for this example. What I am particularly lost on, is how to transfer the data from one 'formpage' to the next, as the information stacks up until the final 'submit' page.

I want it to function like one form spread over several pages.

Any guidance or advice here would be greatly appreciated.

Form Page 1

<html>

<head>

<title>Form Page 1</title>

</head>

<body>

<form action="formpage2.php" method="POST">

<input type="text" id="userName" name="userName" placeholder="Enter Your Name.." required/>

<input type="submit" value="Continue">

</form>

</body>

</html>

Form Page 2

<html>

<head>

<title>Form Page 2</title>

</head>

<body>

<form action="formpage3.php" method="POST">

<!-- Data Stack from previous formpage(s)-->

<?php

$name = $_POST['userName'];


?>


<select id="userAge" name="userAge" >
<option value="0" selected="selected" disabled="disabled">Age</option>
<option value="Under 18">Under 18</option>
<option value="18-25">18-25</option>
<option value="26-35">26-35</option>
<option value="36-45">36-45</option>
<option value="46-55">46-55</option>
<option value="56-65">56-65</option>
<option value="66 ">66 </option>

</select>


<input type="submit" value="Continue">

</form>

</body>

</html>

Form Page 3

<html>

<head>

<title>Form Page 3</title>

</head>

<body>

<form action="formpage4.php" method="POST">

<!-- Data Stack from previous formpage(s)-->

<?php

$name = $_POST['userName'];
$age = $_POST['userAge'];


?>


<textarea id="userMessage"  name="userMessage" placeholder="Type message here..."></textarea>


<input type="submit" value="Continue">

</form>

</body>

</html>

Form Page 4

<html>

<head>

<title>Form Page 4</title>

</head>

<body>

<form action="formpage5.php" method="POST">

<!-- Data Stack from previous formpage(s)-->

<?php

$name = $_POST['userName'];
$age = $_POST['userAge'];
$message = $_POST['userMessage']


?>


<input type="checkbox" id="terms" name="terms" value="Agreed">


<input type="submit" value="Submit Form">

</form>

</body>

</html>

Form Page 5

<?php

$name = $_POST['userName'];
$age = $_POST['userAge'];
$message = $_POST['userMessage'];
$termsAgreed = $_POST['terms'];


/////////////////////////////////////////////////////////////
/////////////////////////////////////////////////////////////


$composition =

"\r\n\n\nName: "                        . $name .
"\r\nAge: "                             . $age .
"\r\n\nAgreed To Terms & Conditions?: "  . $termsAgreed .
"\r\n\n\nMessage: "                     . $message;


/* I left out the bottom of this final handling page, 
because it isn't relevant to my particular issue */



?>

CodePudding user response：

I would say you're already in the correct path. I think you can utilize hidden form field in your code and it should be easy enough for you to understand.

Let say you have page1.php

<html>
  <head>
    <title>Form Page 1</title>
  </head>
  <body>
    <form action="page2.php" method="POST">
      <input type="text" id="userName" name="userName" placeholder="Enter Your Name.." required/>
      <input type="submit" value="Continue">
    </form>
  </body>
</html>

Then on page2.php

<html>
  <head>
    <title>Form Page 1</title>
  </head>
  <body>
    <form action="page3.php" method="POST">
      <input type="hidden" name="userName" value="<?php echo $_POST['userName']; ?>" /> <!-- <-- the hidden field -->
      <select id="userAge" name="userAge" >
        <option value="0" selected="selected" disabled="disabled">Age</option>
        <option value="Under 18">Under 18</option>
        <option value="18-25">18-25</option>
        <option value="26-35">26-35</option>
        <option value="36-45">36-45</option>
        <option value="46-55">46-55</option>
        <option value="56-65">56-65</option>
        <option value="66 ">66 </option>
      </select>
      <input type="submit" value="Continue">
    </form>
  </body>
</html>

It continue the same on next page, you put in the previous form in hidden field with the same name, then when you submit at the last page its like you're submitting all the form value at the last stage and your php code able to get all the value from $_POST[] array.