Search code examples
phpjavascriptjqueryhtmldhtml

USING two webpages to submit form values

I have a total of 3 pages; form elements are distributed among two pages, "eg1.html" and "eg2.html", but the form elements are submitted to "eg.php".

Here is the code for eg.php:

$size=$_POST["fontsize"];
$label=$_POST["label"];
$age=$_POST["age"];
$sex =$_POST["sex"];

code for eg1.html

 <html> 
 <body> 
 <form action="eg.php" method="post"> 
 <input type="radio" name="fontsize" value="3"/> 
 <link to eg2.html>
 <input type="radio" name="label" value="stacks"/> 
 <input type="submit" name = "down" value = "down"> 
 </form> 
 </body>

code for eg2.html

 <html> 
 <body> 
 <form action="eg.php" method="post">
 <input type="radio" name="age" value="18"/> 
 <input type="radio" name="sex" value="female"/> 
 <input type="submit" name = "down" value = "down"> 
 </form> 
 </body> 
 </html>

I have added a link to eg2.html in eg1.html. That means that first the user will open eg1.html; he will select the form elements before submitting the form elements he will be provided with a link to eg2.html; once he clicks on the link, he will be redirected to eg2.html.

In eg2.html he should be able to select other form elements, and after selecting he will be redirected back to eg1.html, where he will be able to submit all form elements to eg.php [which includes both eg1 and eg2]

I have seen many websites using this tecniques.

Solution

  • Depending on how you want to handle this, you can

    1. Let the server cache the first half of the response
    2. Pass the data along to the second page to be submitted together
    3. Put them in 1 page, and make it look like 2 pages

    To cache on the server, you'll probably need to use temp files or a database. This is very cumbersome, but the upside is that the user can do half of it, go for dinner, and come back to continue.

    To pass the data along to the second page, you can choose to attach that information in the link provided to the next page, using location.hash. Alternatively, you can use cookies.

    The third one is also relatively easy to accomplish. Use divs or iframes for each page and have the top document hold the data.