Hello everyone, I am new to this forum but i'm hoping you will all go easy on me! I am currently doing an e-commerce website for my course, and I have run into difficulty with the checkout page. Let me note, that this website only requires HTML, CSS, Javascript and cgi/perl (no php, ajax, etc). My web order structure is: frameset page-->
products page-->address details-->control page-->confirmation page.
Any how I am unable to carry forward the 'address details' values forward.
Currently my codes are:
Frameset page named "products2.html"
<HTML>
<HEAD>
<TITLE>Products Page</TITLE>
</HEAD>
<FRAMESET COLS="*,10" BORDER="0">
<FRAME SRC="products.html">
<FRAME SRC="control.htm">
</FRAMESET>
</HTML>
products.html page:
<javascript>
function processproducts() {
products = document.forms["choices"]
if(products.total.value=="" || products.total.value=="0")
alert("You must select item and quantity!")
else {
controlForm = parent.frames[1].document.controlForm
controlForm.total.value=products.total.value
controlForm.myTextArea.value=products.myTextArea.value
location.href="ship.html"
}
} </script>
<form Action="" method="post"form name="choices" >
<table>
<tr><td>The Value of your order in £s is:</td></tr>
<tr><td><input type=text name="total" size=12></td></tr>
<tr><td>Products Ordered:</tr></td>
<tr><td><textarea name="myTextArea" value="Blank" rows=6 cols=60>
</textarea></td><tr>
<tr><td><input type=button value="Sub-Total" onClick=submitOrder()></td></tr>
<tr><td><input type=reset value="Clear"></td></tr>
<tr><td><input type=button Name="next" value="Next" onClick=processproducts()></td></tr>
</table>
</form>
ship.html
<script Language="JavaScript">
function processship() {
ship = document.forms["shipDetails"]
if(ship.firstName.value=="" || ship.firstName.value=="0"|| ship.lastName.value==""||
ship.lastName.value=="0"|| ship.street.value==""|| ship.street.value=="0" ||
ship.city.value=="0"|| ship.city.value==""|| ship.country.value=="0"|| ship.country.value==""||
ship.postcode.value=="0"|| ship.postcode.value==""|| ship.phone.value==""||
ship.phone.value=="0"|| ship.email.value==""|| ship.email.value=="0")
alert("Error in shipping details, please correct")
else{
controlForm = parent.frames[1].document.controlForm
controlForm.lastName.value=ship.lastName.value
controlForm.firstName.value=ship.firstName.value
controlForm.street.value=ship.street.value
controlForm.city.value=ship.city.value
controlForm.country.value=ship.country.value
controlForm.postcode.value=ship.postcode.value
controlForm.phone.value=ship.phone.value
controlForm.email.value=ship.email.value
location.href="form3.htm"
}
}
</script>
<form Action="" form name="shipDetails" method="post" action="">
<p>First name: <input type="TEXT" name="firstName">
Last name: <input type="TEXT" name="lastName">
</p>
<p>Street address:
<input type="TEXT" name="street" size="50">
</p>
<p>City: <input type="TEXT" name="city"></p>
<p>Country: <input type="TEXT" name="country">
Postal code: <input type="TEXT" name="postcode"></p>
<p>Phone number: <input type="TEXT" name="phone"></p>
<p>E-mail address: <input type="TEXT" name="email" size="30">
</p>
<p></p>
<input type=button name="next" value="Confirm Order" onClick=processship() >
</form>
controlForm.htm
<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript"><!--
// --></SCRIPT>
</HEAD>
<BODY>
<FORM ACTION="http://.../cgi/thanks.cgi"
NAME="controlForm"
METHOD="post" TARGET="_top">
<INPUT TYPE="HIDDEN" NAME="firstName" VALUE="">
<INPUT TYPE="HIDDEN" NAME="lastName" VALUE="">
<INPUT TYPE="HIDDEN" NAME="street" VALUE="">
<INPUT TYPE="HIDDEN" NAME="city" VALUE="">
<INPUT TYPE="HIDDEN" NAME="postcode" VALUE="">
<INPUT TYPE="HIDDEN" NAME="phone" VALUE="">
<INPUT TYPE="HIDDEN" NAME="email" VALUE="">
<INPUT TYPE="HIDDEN" NAME="total" VALUE="">
<INPUT TYPE="HIDDEN" NAME="myTextArea" VALUE="">
</FORM>
</BODY>
</HTML>
My confirmation page will be generated by .cgi
I would be very grateful if anyone could have a look and see where my coding has gone wrong especially as when I get to "ship.html" and click the submit button, it does not