jfindon
05-08-2006, 03:44 AM
I want to set a cookie when the user enters their name on the order page and then retrieve it when they click the calculate button and thank them by name. I don't know where to start, things that I tried didn't work so I deleted them. Can you set and retrieve a cookie in the same page?
<html>
<head>
<title>Jarrod's Bargain Games</title>
<link href="styles.css" rel="stylesheet" type="text/css">
<script type="text/javascript">
<!-- Hide
var tax;
var amt;
var shipping;
function calcAmt(state,items,price) {
if (state == 'NY')
tax = 1.08;
else if (state == 'NJ')
tax = 1.07;
else if (state == 'PA')
tax = 1.06;
else
tax = 1;
amt = items * price;
if (amt <= 25)
shipping = 2.50;
else if ((amt >= 25.01) && (amt <= 75))
shipping = 5;
else if ((amt >= 75.01) && (amt <= 150))
shipping = 7.50;
else
shipping = 10;
amt = amt * tax;
amt = amt + shipping;
amt = amt.toFixed(2);
document.forms[0].totPrice.value = amt;
}
var curBanner="logo1";
function changeBanner() {
if (curBanner == "logo2") {
document.images[0].src= "logo1.jpg";
curBanner = "logo1";
}
else {
document.images[0].src= "logo2.jpg";
curBanner = "logo2";
}
}
// STOP -->
</script>
</head>
<body onload="setInterval('changeBanner()', 2000)">
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td align="center" valign="top">
<table cellpadding="12" height="500" width="600" border="0" cellspacing="0" cellpadding="0">
<tr>
<td colspan="2" valign="top" align="center" height="100"><img src="logo1.jpg"/>
</td>
</tr>
<tr>
<td colspan="2" align="center" height="200">
<table height="200" width="500" border="0">
<tr>
<td width="300"
<p>Proclaimed as the best basketball game on the Xbox 360,this brand new copy of NBA2K6 will keep you entertained for hours.
</p>
</td>
<td>
<img src="big1.jpg">
</td>
</tr>
</table>
<hr style="color:red; width:1024px">
<form action="">
<P>Name<BR>
<INPUT TYPE="text" NAME="name" SIZE=50></P>
<P>Address<BR>
<INPUT TYPE="text" NAME="address" SIZE=50></P>
<P>City, State, Zip<BR>
<INPUT TYPE="text" NAME="city" SIZE=38>
<INPUT TYPE="text" NAME="user_state" SIZE=2 MAXLENGTH=2>
<INPUT TYPE="text" NAME="zip" SIZE=5 MAXLENGTH=5></P>
<p>Quantity:<br>
<input type="text" name="quantity" SIZE="2"</p>
<p>Item Price:<br>
<input type="text" name="itemPrice" value="45.00" READONLY SIZE="4"</p><br><hr style="color:red; width:1024px">
<p>Total:<Br>
<input type="text" name="totPrice" READONLY SIZE="4"><br><br>
<input type="button" value="Calculate" onClick="calcAmt(user_state.value, eval(quantity.value), eval(itemPrice.value))"><br>
</form>
<center><a href="index.htm">Back to Jarrod's Bargain Games</a></center>
</body>
</html>
EDIT: Ok I got that figured out, but can you look at this new code and tell me what I have to add so that after you hit "Finalize Order" you go to a page called "received.htm"?
<html>
<head>
<title>Jarrod's Bargain Games</title>
<link href="styles.css" rel="stylesheet" type="text/css">
<script type="text/javascript">
<!-- Hide
var tax;
var amt;
var shipping;
function calcAmt(state,items,price) {
if (state == 'NY')
tax = 1.08;
else if (state == 'NJ')
tax = 1.07;
else if (state == 'PA')
tax = 1.06;
else
tax = 1;
amt = items * price;
if (amt <= 25)
shipping = 2.50;
else if ((amt >= 25.01) && (amt <= 75))
shipping = 5;
else if ((amt >= 75.01) && (amt <= 150))
shipping = 7.50;
else
shipping = 10;
amt = amt * tax;
amt = amt + shipping;
amt = amt.toFixed(2);
document.forms[0].totPrice.value = amt;
}
var curBanner="logo1";
function changeBanner() {
if (curBanner == "logo2") {
document.images[0].src= "logo1.jpg";
curBanner = "logo1";
}
else {
document.images[0].src= "logo2.jpg";
curBanner = "logo2";
}
}
function setCookie() {
var expiresDate = new Date();
expiresDate.setFullYear(expiresDate.getFullYear() + 1);
document.cookie = encodeURI("name="
+ document.forms[0].name.value) + "; expires="
+ expiresDate.toUTCString();
}
function getUserPrefs() {
var userPrefs = decodeURI(document.cookie);
var prefs = userPrefs.split("; ");
var name = prefs[0].split("=");
window.alert("Thank you for your order " + name[1]);
}
// STOP -->
</script>
</head>
<body onload="setInterval('changeBanner()', 2000)">
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td align="center" valign="top">
<table cellpadding="12" height="500" width="600" border="0" cellspacing="0" cellpadding="0">
<tr>
<td colspan="2" valign="top" align="center" height="100"><img src="logo1.jpg"/>
</td>
</tr>
<tr>
<td colspan="2" align="center" height="200">
<table height="200" width="500" border="0">
<tr>
<td width="300"
<p>Proclaimed as the best basketball game on the Xbox 360,this brand new copy of NBA2K6 will keep you entertained for hours.
</p>
</td>
<td>
<img src="big1.jpg">
</td>
</tr>
</table>
<hr style="color:red; width:1024px">
<form action="">
<P>Name<BR>
<INPUT TYPE="text" NAME="name" SIZE=50 onchange="setCookie();"></P>
<P>Address<BR>
<INPUT TYPE="text" NAME="address" SIZE=50></P>
<P>City, State, Zip<BR>
<INPUT TYPE="text" NAME="city" SIZE=38>
<INPUT TYPE="text" NAME="user_state" SIZE=2 MAXLENGTH=2>
<INPUT TYPE="text" NAME="zip" SIZE=5 MAXLENGTH=5></P>
<p>Quantity:<br>
<input type="text" name="quantity" SIZE="2"</p>
<p>Item Price:<br>
<input type="text" name="itemPrice" value="45.00" READONLY SIZE="4"</p><br><hr style="color:red; width:1024px">
<p>Total:<Br>
<input type="text" name="totPrice" READONLY SIZE="4"><br><br>
<input type="button" value="Calculate" onClick="calcAmt(user_state.value, eval(quantity.value), eval(itemPrice.value))"><br>
<br>
<input type="submit" name="submit" value="Finalize Order" onClick="getUserPrefs();">
</form>
<center><a href="index.htm">Back to Jarrod's Bargain Games</a></center>
</body>
</html>
<html>
<head>
<title>Jarrod's Bargain Games</title>
<link href="styles.css" rel="stylesheet" type="text/css">
<script type="text/javascript">
<!-- Hide
var tax;
var amt;
var shipping;
function calcAmt(state,items,price) {
if (state == 'NY')
tax = 1.08;
else if (state == 'NJ')
tax = 1.07;
else if (state == 'PA')
tax = 1.06;
else
tax = 1;
amt = items * price;
if (amt <= 25)
shipping = 2.50;
else if ((amt >= 25.01) && (amt <= 75))
shipping = 5;
else if ((amt >= 75.01) && (amt <= 150))
shipping = 7.50;
else
shipping = 10;
amt = amt * tax;
amt = amt + shipping;
amt = amt.toFixed(2);
document.forms[0].totPrice.value = amt;
}
var curBanner="logo1";
function changeBanner() {
if (curBanner == "logo2") {
document.images[0].src= "logo1.jpg";
curBanner = "logo1";
}
else {
document.images[0].src= "logo2.jpg";
curBanner = "logo2";
}
}
// STOP -->
</script>
</head>
<body onload="setInterval('changeBanner()', 2000)">
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td align="center" valign="top">
<table cellpadding="12" height="500" width="600" border="0" cellspacing="0" cellpadding="0">
<tr>
<td colspan="2" valign="top" align="center" height="100"><img src="logo1.jpg"/>
</td>
</tr>
<tr>
<td colspan="2" align="center" height="200">
<table height="200" width="500" border="0">
<tr>
<td width="300"
<p>Proclaimed as the best basketball game on the Xbox 360,this brand new copy of NBA2K6 will keep you entertained for hours.
</p>
</td>
<td>
<img src="big1.jpg">
</td>
</tr>
</table>
<hr style="color:red; width:1024px">
<form action="">
<P>Name<BR>
<INPUT TYPE="text" NAME="name" SIZE=50></P>
<P>Address<BR>
<INPUT TYPE="text" NAME="address" SIZE=50></P>
<P>City, State, Zip<BR>
<INPUT TYPE="text" NAME="city" SIZE=38>
<INPUT TYPE="text" NAME="user_state" SIZE=2 MAXLENGTH=2>
<INPUT TYPE="text" NAME="zip" SIZE=5 MAXLENGTH=5></P>
<p>Quantity:<br>
<input type="text" name="quantity" SIZE="2"</p>
<p>Item Price:<br>
<input type="text" name="itemPrice" value="45.00" READONLY SIZE="4"</p><br><hr style="color:red; width:1024px">
<p>Total:<Br>
<input type="text" name="totPrice" READONLY SIZE="4"><br><br>
<input type="button" value="Calculate" onClick="calcAmt(user_state.value, eval(quantity.value), eval(itemPrice.value))"><br>
</form>
<center><a href="index.htm">Back to Jarrod's Bargain Games</a></center>
</body>
</html>
EDIT: Ok I got that figured out, but can you look at this new code and tell me what I have to add so that after you hit "Finalize Order" you go to a page called "received.htm"?
<html>
<head>
<title>Jarrod's Bargain Games</title>
<link href="styles.css" rel="stylesheet" type="text/css">
<script type="text/javascript">
<!-- Hide
var tax;
var amt;
var shipping;
function calcAmt(state,items,price) {
if (state == 'NY')
tax = 1.08;
else if (state == 'NJ')
tax = 1.07;
else if (state == 'PA')
tax = 1.06;
else
tax = 1;
amt = items * price;
if (amt <= 25)
shipping = 2.50;
else if ((amt >= 25.01) && (amt <= 75))
shipping = 5;
else if ((amt >= 75.01) && (amt <= 150))
shipping = 7.50;
else
shipping = 10;
amt = amt * tax;
amt = amt + shipping;
amt = amt.toFixed(2);
document.forms[0].totPrice.value = amt;
}
var curBanner="logo1";
function changeBanner() {
if (curBanner == "logo2") {
document.images[0].src= "logo1.jpg";
curBanner = "logo1";
}
else {
document.images[0].src= "logo2.jpg";
curBanner = "logo2";
}
}
function setCookie() {
var expiresDate = new Date();
expiresDate.setFullYear(expiresDate.getFullYear() + 1);
document.cookie = encodeURI("name="
+ document.forms[0].name.value) + "; expires="
+ expiresDate.toUTCString();
}
function getUserPrefs() {
var userPrefs = decodeURI(document.cookie);
var prefs = userPrefs.split("; ");
var name = prefs[0].split("=");
window.alert("Thank you for your order " + name[1]);
}
// STOP -->
</script>
</head>
<body onload="setInterval('changeBanner()', 2000)">
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td align="center" valign="top">
<table cellpadding="12" height="500" width="600" border="0" cellspacing="0" cellpadding="0">
<tr>
<td colspan="2" valign="top" align="center" height="100"><img src="logo1.jpg"/>
</td>
</tr>
<tr>
<td colspan="2" align="center" height="200">
<table height="200" width="500" border="0">
<tr>
<td width="300"
<p>Proclaimed as the best basketball game on the Xbox 360,this brand new copy of NBA2K6 will keep you entertained for hours.
</p>
</td>
<td>
<img src="big1.jpg">
</td>
</tr>
</table>
<hr style="color:red; width:1024px">
<form action="">
<P>Name<BR>
<INPUT TYPE="text" NAME="name" SIZE=50 onchange="setCookie();"></P>
<P>Address<BR>
<INPUT TYPE="text" NAME="address" SIZE=50></P>
<P>City, State, Zip<BR>
<INPUT TYPE="text" NAME="city" SIZE=38>
<INPUT TYPE="text" NAME="user_state" SIZE=2 MAXLENGTH=2>
<INPUT TYPE="text" NAME="zip" SIZE=5 MAXLENGTH=5></P>
<p>Quantity:<br>
<input type="text" name="quantity" SIZE="2"</p>
<p>Item Price:<br>
<input type="text" name="itemPrice" value="45.00" READONLY SIZE="4"</p><br><hr style="color:red; width:1024px">
<p>Total:<Br>
<input type="text" name="totPrice" READONLY SIZE="4"><br><br>
<input type="button" value="Calculate" onClick="calcAmt(user_state.value, eval(quantity.value), eval(itemPrice.value))"><br>
<br>
<input type="submit" name="submit" value="Finalize Order" onClick="getUserPrefs();">
</form>
<center><a href="index.htm">Back to Jarrod's Bargain Games</a></center>
</body>
</html>