PDA

View Full Version : Send form data from product select page to order form page?



David4321
03-04-2009, 06:35 PM
This site has very simple product pages (nothing but images and buy now button) which display within an inline frame on the catalog page in response to the user choices. Clicking the buy now button takes user to the order form page. The order form sends form mail upon submission. (currently using godaddy gdform.php)

I need to get the product selection data (just the item #) from the product page where the user clicks the button, to be included on the existing form mail that goes out upon submission of the order form on the next page. How can I get the data from the product page to the order form page? (or otherwise be made a part of the data sent on the existing form mail)

I know I've seen this before: you fill out something in a form on one page, and when you continue, the next page knows what you entered, or has it pre-filled in. I'm thinking maybe the item # could be sent to a hidden field on the actual order form... or ???

I don't actually know any php, mostly html. Please respond through providing info about what method might usually be used, and if possible a complete script, a link to one, or the right search terms for me to find one. If I'm on the wrong track, please let me know if there is a better method than php.

Thanks...

Nile
03-04-2009, 11:59 PM
In the past, what I did, was put all the information of the item in an array, then json_encoded it (refer to php manual), then, on the page it would have a hidden input that would hold the string of the json encode. Then it would be processed to the buy page, where it would then be json_decoded, and all the info would be spilled out using the foreach function(or just for).

Hope this helps,
Nile

David4321
03-05-2009, 12:33 AM
Thanks for responding.

What I'm really looking for is a simple direct complete explanation of how to actually move the data from one page to another. Just HOW to do it, the method. There is very little data to move, just 1 short item code #, no need to encode it.

I don't know php at all. I can copy scraps, and even adapt them.

I'm imagining there is some little scrap to put in the product page button form to send the item # to the php page; then the php page itself, to turn it around and send it to the real order form; then a scrap for the hidden field in the order form to ask for the item # from the php page. Have I got this straight? Can you provide or direct me to any of these scraps?

Mucho gracias...

Nile
03-05-2009, 12:34 AM
Ok, can I see the code involved in the process of buying an item please?

Thanks!

David4321
03-05-2009, 06:45 AM
Here is the code from the product page. There's really nothing but the product images, and a roll over image of the buy-now button on a simple form field. The button has an internal link to the order page. I haven't entered any variables into the form yet - that's what I'm doing here. I haven't inserted the item # anywhere yet either, I assumed it would be in the php.

Thanks so much for your help.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Untitled Page</title>
<style type="text/css">
div#container
{
width: 376px;
position: relative;
margin-top: 0px;
margin-left: auto;
margin-right: auto;
text-align: left;
}
body
{
text-align: center;
margin: 0;
}
</style>
<style type="text/css">
a:visited
{
color: #0000FF;
}
a:active
{
color: #0000FF;
}
</style>
<style type="text/css">
img { behavior: url("pngfix.htc"); }
</style>
</head>
<body bgcolor="#000000" text="#FFFFFF" style="background-position:center top ;">
<div id="container">
<div id="wb_Form1" style="position:absolute;left:19px;top:440px;width:342px;height:91px;z-index:0" align="left">
<form name="Form_selection" method="post" action="orderform.php" enctype="text/plain" id="Form1" >
<input name="item" type="hidden" value="item-test">
<input name="order" type="submit" value="Submit">
</form>
</div>
<div id="wb_Image1" style="overflow:hidden;position:absolute;left:16px;top:17px;z-index:1" align="left">
<img src="images/B-greenleaf-A3_340.jpg" id="Image1" alt="" align="top" border="0" style="width:340px;height:195px;"></div>
<div id="wb_Image2" style="overflow:hidden;position:absolute;left:16px;top:227px;z-index:2" align="left">
<img src="images/B-red-A3-L_340.jpg" id="Image2" alt="" align="top" border="0" style="width:340px;height:195px;"></div>
<div id="wb_RollOver1" style="position:absolute;left:41px;top:450px;width:290px;height:70px;z-index:3" align="left">
<script language="JavaScript" type="text/javascript">
<!--
RollOver1 = new Image();
RollOver1.src = "images/Buy-Now-buttonRG-roll.png";
//-->
</script>
<a href="./order.html" target="_parent">
<img src="images/Buy-Now-buttonRG.png" id="RollOver1" width="290" height="70" alt="" border="0" onMouseOver="this.src='images/Buy-Now-buttonRG-roll.png'" onMouseOut="this.src='images/Buy-Now-buttonRG.png'">
</a>
</div>
</div>
</body>
</html>

David4321
03-05-2009, 06:50 AM
Here is the code for the form on the order page:

<form name="Form1" method="post" action="http://www.mymangosteencards.com/gdform.php" enctype="multipart/form-data" id="Form2" onsubmit="return ValidateForm1(this)" ><input type="hidden" name="redirect" value="purchase.html"><input type="hidden" name="subject" value="Order Information">
<div id="wb_Text2" style="position:absolute;left:30px;top:160px;width:320px;height:66px;z-index:53" align="left">
<font style="font-size:16px" color="#FFFFFF" face="Trebuchet MS">Photo must be digital image of reasonable quality from camera, cell phone, or scan. Plain background is best - solid is ideal.</font></div>
<div id="wb_Text3" style="position:absolute;left:30px;top:50px;width:195px;height:24px;z-index:54" align="left">
<font style="font-size:19px" color="#FFFFFF" face="Trebuchet MS">I will provide photo</font></div>
<div id="wb_Text4" style="position:absolute;left:620px;top:130px;width:160px;height:54px;z-index:55" align="left">
<font style="font-size:21px" color="#FFFFFF" face="Trebuchet MS">Select Type Style</font></div>
<div id="wb_Text5" style="position:absolute;left:620px;top:160px;width:180px;height:27px;z-index:56" align="left">
<font style="font-size:21px" color="#FFFFFF" face="Trebuchet MS">Select Card Back</font></div>
<div id="wb_Text6" style="position:absolute;left:440px;top:20px;width:351px;height:54px;z-index:57" align="left">
<font style="font-size:21px" color="#FFFFFF" face="Trebuchet MS"><b>Information entered in the section below will appear on card:</b></font></div>
<div id="wb_Text10" style="position:absolute;left:30px;top:100px;width:340px;height:48px;z-index:58" align="left">
<font style="font-size:19px" color="#FFFFFF" face="Trebuchet MS">Email photo (up to 5mb) to: photos@MyMangosteenCards.com</font></div>
<div id="wb_Text12" style="position:absolute;left:620px;top:190px;width:180px;height:27px;z-index:59" align="left">
<font style="font-size:21px" color="#FFFFFF" face="Trebuchet MS">Select Finish</font></div>
<div id="wb_Text18" style="position:absolute;left:30px;top:20px;width:158px;height:24px;z-index:60" align="left">
<font style="font-size:19px" color="#FFFFFF" face="Trebuchet MS">Quantity</font></div>
<div id="wb_Image8" style="overflow:hidden;position:absolute;left:350px;top:640px;z-index:61" align="left">
<img src="images/Orangebar2.jpg" id="Image8" alt="" align="top" border="0" style="width:420px;height:3px;"></div>
<div id="wb_Text21" style="position:absolute;left:350px;top:660px;width:207px;height:27px;z-index:62" align="left">
<font style="font-size:21px" color="#FFFFFF" face="Trebuchet MS">Shipping Information:</font></div>
<div id="wb_Text22" style="position:absolute;left:30px;top:620px;width:130px;height:27px;z-index:63" align="left">
<font style="font-size:21px" color="#FFFFFF" face="Trebuchet MS">Referred By</font></div>
<div id="wb_Text23" style="position:absolute;left:30px;top:700px;width:234px;height:48px;z-index:64" align="left">
<font style="font-size:19px" color="#FFFFFF" face="Trebuchet MS">Any other instructions<br>
or message for us:</font></div>
<div id="wb_Text25" style="position:absolute;left:340px;top:820px;width:477px;height:22px;z-index:65" align="left">
<font style="font-size:19px" color="#FFFFFF" face="Arial">Secure payment through Paypal or major credit card</font></div>
<div id="wb_Text26" style="position:absolute;left:350px;top:760px;width:96px;height:27px;z-index:66" align="left">
<font style="font-size:21px" color="#FFFFFF" face="Trebuchet MS">Address 2</font></div>
<div id="wb_Text27" style="position:absolute;left:350px;top:730px;width:96px;height:27px;z-index:67" align="left">
<font style="font-size:21px" color="#FFFFFF" face="Trebuchet MS">Address 1</font></div>
<div id="wb_Text28" style="position:absolute;left:350px;top:700px;width:90px;height:27px;z-index:68" align="left">
<font style="font-size:21px" color="#FFFFFF" face="Trebuchet MS">Name(s)</font></div>
<input type="image" name="PayPal1" id="ImageButton2" src="images/button_continue_checkout.gif" style="position:absolute;left:600px;top:870px;width:90px;height:36px;z-index:69" value="Submit"><P>&nbsp;</p></button>

<div id="wb_Image9" style="overflow:hidden;position:absolute;left:360px;top:870px;z-index:70" align="left">
<img src="images/Paypal_all_150.jpg" id="Image9" alt="" align="top" border="0" style="width:150px;height:41px;"></div>
<div id="wb_Text33" style="position:absolute;left:350px;top:400px;width:111px;height:27px;z-index:73" align="left">
<font style="font-size:21px" color="#FFFFFF" face="Trebuchet MS">Website</font></div>
<div id="wb_Text34" style="position:absolute;left:350px;top:370px;width:81px;height:27px;z-index:74" align="left">
<font style="font-size:21px" color="#FFFFFF" face="Trebuchet MS">Email</font></div>
<div id="wb_Text35" style="position:absolute;left:350px;top:330px;width:85px;height:27px;z-index:75" align="left">
<font style="font-size:21px" color="#FFFFFF" face="Trebuchet MS">Phone 3</font></div>
<div id="wb_Text36" style="position:absolute;left:350px;top:300px;width:85px;height:27px;z-index:76" align="left">
<font style="font-size:21px" color="#FFFFFF" face="Trebuchet MS">Phone 2</font></div>
<div id="wb_Text37" style="position:absolute;left:350px;top:270px;width:85px;height:27px;z-index:77" align="left">
<font style="font-size:21px" color="#FFFFFF" face="Trebuchet MS">Phone 1</font></div>
<div id="wb_Text41" style="position:absolute;left:350px;top:230px;width:90px;height:27px;z-index:78" align="left">
<font style="font-size:21px" color="#FFFFFF" face="Trebuchet MS">Name(s)</font></div>
<textarea name="12_Messages :" id="TextArea2" style="position:absolute;left:30px;top:760px;width:240px;height:141px;font-family:Trebuchet MS;z-index:79" rows="5" cols="31"></textarea>
<input type="text" id="Editbox2" style="position:absolute;left:30px;top:650px;width:238px;font-family:Franklin Gothic Book;font-size:16px;z-index:80" size="34" name="11_Referred_By :" value="">
<input type="text" id="Editbox1" style="position:absolute;left:490px;top:760px;width:287px;font-family:Franklin Gothic Book;font-size:16px;z-index:81" size="41" name="15_Ship_Address2:" value="">
<input type="text" id="Editbox4" style="position:absolute;left:490px;top:730px;width:287px;font-family:Franklin Gothic Book;font-size:16px;z-index:82" size="41" name="14_Ship_Address1:" value="">
<input type="text" id="Editbox3" style="position:absolute;left:490px;top:700px;width:287px;font-family:Franklin Gothic Book;font-size:16px;z-index:83" size="41" name="13_Ship_Name :" value="We cannot ship to P.O. Box" tabindex="Name">
<input type="text" id="Editbox6" style="position:absolute;left:490px;top:480px;width:287px;font-family:Franklin Gothic Book;font-size:16px;z-index:84" size="41" name="10_Slogan/Quote :" value="optional">
<input type="text" id="Editbox7" style="position:absolute;left:490px;top:440px;width:287px;font-family:Franklin Gothic Book;font-size:16px;z-index:85" size="41" name="07_Distributor# :" value="optional">
<input type="text" id="Editbox10" style="position:absolute;left:490px;top:400px;width:287px;font-family:Franklin Gothic Book;font-size:16px;z-index:86" size="41" name="06_Website :" value="optional">
<input type="text" id="Editbox9" style="position:absolute;left:490px;top:370px;width:287px;font-family:Franklin Gothic Book;font-size:16px;z-index:87" size="41" name="05_Email :" value="">
<input type="text" id="Editbox12" style="position:absolute;left:550px;top:330px;width:224px;font-family:Franklin Gothic Book;font-size:16px;z-index:88" size="32" name="04_Phone3 :" value="optional" tabindex="Phone 3">
<input type="text" id="Editbox11" style="position:absolute;left:550px;top:300px;width:224px;font-family:Franklin Gothic Book;font-size:16px;z-index:89" size="32" name="03_Phone2 :" value="optional" tabindex="Phone 2">
<input type="text" id="Editbox14" style="position:absolute;left:550px;top:270px;width:224px;font-family:Franklin Gothic Book;font-size:16px;z-index:90" size="32" name="02_Phone1 :" value="" tabindex="Phone 1">
<select name="02_Phone1Tp :" size="1" id="Combobox1" style="position:absolute;left:490px;top:270px;width:53px;font-family:Franklin Gothic Book;font-size:16px;z-index:91" tabindex="Phone 1 Type">
<option></option>
<option value="p.">p.</option>
<option value="c.">c.</option>
<option value="f.">f.</option>
<option value="h.">h.</option>
<option value="blank">blank</option>
</select>
<select name="03_Phone2Tp :" size="1" id="Combobox4" style="position:absolute;left:490px;top:300px;width:53px;font-family:Franklin Gothic Book;font-size:16px;z-index:92" tabindex="Phone 2 Type">
<option></option>
<option value="Ph">Ph</option>
<option value="Cell">Cell</option>
<option value="Fax">Fax</option>
<option value="Hm">Hm</option>
<option value="Bus">Bus</option>
<option value="blank">blank</option>
</select>
<select name="04_Phone3Tp :" size="1" id="Combobox3" style="position:absolute;left:490px;top:330px;width:53px;font-family:Franklin Gothic Book;font-size:16px;z-index:93" tabindex="Phone 1 Type">
<option></option>
<option value="Ph">Ph</option>
<option value="Cell">Cell</option>
<option value="Fax">Fax</option>
<option value="Hm">Hm</option>
<option value="Bus">Bus</option>
<option value="blank">blank</option>
</select>

/---------more---------/

</select>
<div id="wb_Shape8" style="position:absolute;left:30px;top:250px;width:247px;height:357px;z-index:100" align="center">
<img src="images/order_0052.png" id="Shape8" align="top" alt="" title="" border="0" width="247" height="357"></div>
</form>

JasonDFR
03-05-2009, 07:18 AM
David,

Is below what the user clicks on to select an item?


<a href="./order.html" target="_parent">
<img src="images/Buy-Now-buttonRG.png" id="RollOver1" width="290" height="70" alt="" border="0" onMouseOver="this.src='images/Buy-Now-buttonRG-roll.png'" onMouseOut="this.src='images/Buy-Now-buttonRG.png'">
</a>

What is this:


<div id="container">
<div id="wb_Form1" style="position:absolute;left:19px;top:440px;width:342px;height:91px;z-index:0" align="left">
<form name="Form_selection" method="post" action="orderform.php" enctype="text/plain" id="Form1" >
<input name="item" type="hidden" value="item-test">
<input name="order" type="submit" value="Submit">
</form>
</div>

Once on the order page, you only need an item number to complete the order, right?

I would pass the item number in the URL. You can do this one of two ways.

1) Use an HTML form where:
<form action="orderform.php" method="get">
<input type="hidden" name="item_number" value="123456" />


2) Attach the item number to the URL in the product selection link:

<a href="/orderform.php?item_number=123456">Click here to buy</a>

Either way, on your orderform page, you will need to get the item_number from the URL and place it into the orderform.

You can do that like this:


<?php

// orderform.php

// Make sure item_number exists
if ( $_GET['item_number'] == '' ) {

// THERE IS NO ITEM NUMBER
// Need to handle this possibility
// You should also do some other validation of the item number

}

$item_number = $_GET['item_number'];



Now you can use $item_number as a variable in your orderform.
Perhaps put it in a hidden input field as value="<?php echo $item_number; ?>"

Hope this helps.

Good luck,

J