PDA

View Full Version : Help with simple JavaScript page for school? Please!



Iconoclast
12-07-2008, 10:42 PM
Hi guys, I've got an assignment due on Tuesday for a JavaScript class and as sad as it is I seem to be having some trouble with it...I think I have everything I need, but I'm probably not doing the syntax right or maybe I'm missing something completely. Here's what I'm supposed to do (first two pages are instructions, last page is what it's supposed to look like):

http://img525.imageshack.us/img525/1014/001vq9.th.jpg (http://img525.imageshack.us/my.php?image=001vq9.jpg)
http://img242.imageshack.us/img242/5632/002uz3.th.jpg (http://img242.imageshack.us/my.php?image=002uz3.jpg)

http://img525.imageshack.us/img525/9673/003pk2.th.jpg (http://img525.imageshack.us/my.php?image=003pk2.jpg)


Here's the code that I have, I'm only using an index and an external stylesheet. As I said I know I must be missing something or doing something wrong but for the life of me I can't seem to figure it out...if anyone could help me out and tell me what part I've made a mistake in and maybe how to fix it I would greatly appreciate it! Thanks so much!




<html>

<head>

<title>Example Page</title>

<link rel="stylesheet" type="text/css" href="stylesheet.css">



<script type="text/javascript">

function enrollStudent(f)
{
var courseInfo = "";
var coursePrice = new Array(1);
var courseCount = 0;

if (f.aspNetForBeginners.checked)
{
courseInfo = "ASP.NET for Beginners - 130.00 \n";
coursePrice[0] = 130.00;
courseCount++;
}

if (f.aspNetAdvanced.checked)
{
courseInfo = courseInfo + "ASP.NET Advanced - 180.00 \n";
coursePrice[1] = 180.00;
courseCount++;
}

if (f.ajax.checked)
{
courseInfo = courseInfo + "AJAX - 100.95 \n";
coursePrice[2] = 100.95;
courseCount++;
}

if (f.xhtml.checked)
{
courseInfo = courseInfo + "XHTML - 100.95 \n";
coursePrice[3] = 100.95;
courseCount++;
}

if (f.xml.checked)
{
courseInfo = courseInfo + "XML - 110.90 \n";
coursePrice[4] = 110.90;
courseCount++;
}


if (courseCount == 0)
{
alert('No courses have been selected. Please select your courses and click the Enroll Now button.');
}
else
{
calTotal();
applyDiscount();
printReceipt(document.onlineEnrollment);
}
}



function calTotal()
{
var subtotal = 0;
for(var i = 0; i < coursePrice.length; i++)
{
subtotal += coursePrice[i];
}
return total
}

function applyDiscount()
{

var discountAmount = "";

if (bonusCodeBox.value = "1234")
{
if (courseCount > 3)
{
total = subtotal - coursePrice[2];
discountAmount = "- $" + coursePrice[2];
}
else if (courseCount > 2)
{
total = subtotal - (coursePrice[1] / 2);
discountAmount = "- $" + (coursePrice[1] / 2);
}
else if (courseCount > 1)
{
total = subtotal - (coursePrice[0] / 4);
discountAmount = "- $" + (coursePrice[0] / 4);
}
else if (courseCount == 1)
{
total = subtotal - 25;
discountAmount = "- $25.00";
}
}
else
{
discountAmount = "- $0";
}
}

function printReceipt(f)
{
f.outputResults.value = "Student Receipt" \n \nf.firstNameBox.value + " " + f.lastNameBox.value \nf.cityBox.value + ", " + f.selectProvince.options[f.selectProvince.selectedIndex].value \nf.streetBox.value \n f.postalCodeBox.value \n \ncourseInfo \n \n"Sub Total: $" + subtotal \n"Discount: " + discountAmount \n"Total: $" + total;
}

</script>


</head>


<body>

<div id="leftright">

<div class="left">

<div class="title">Sign-up for the Following Online Web Programming Courses</div><br /><br />

<div class="subtitle">Please Enter your name and address:</div><br /><br />



<form name="onlineEnrollment">

&nbsp
First name:
<input type="text" name="firstNameBox" size="30" />

Last name:
<input type="text" name="lastNameBox" size="30" /><br />

&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
Street: <input type="text" name="streetBox" size="30" /><br />

&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
City:
<input type="text" name="cityBox" size="30" />

&nbsp&nbsp
Province:
<select name="selectProvince">
<option>Ontario</option>
<option>Alberta</option>
<option>British Columbia</option>
<option>Manitoba</option>
<option>Saskatchewan</option>
<option>New Brunswick</option>
<option>Nova Scotia</option>
<option>Prince Edward Island</option>
<option>Newfoundland & Labrador</option>
<option>Northwest Territories</option>
<option>Yukon</option>
<option>Nunavut</option>
</select><br />

Postal Code:
<input type="text" name="postalCodeBox" size="30" /><br /><br />

<div class="subtitle">Select the courses you would like to take and click the "Enroll Now" button.</div><br /><br />


<table name="courseTable" border="1px">
<div class="table">
<tr>
<td>
<input type="checkbox" name="aspNetForBeginners" />
</td>
<td>
ASP.NET for Beginners
</td>
<td>
$130.00
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="aspNetAdvanced" />
</td>
<td>
ASP.NET Advanced
</td>
<td>
$180.00
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="ajax" />
</td>
<td>
AJAX (Asynchronous JavaScript an XML)
</td>
<td>
$100.95
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="xhtml" />
</td>
<td>
XHTML
</td>
<td>
$100.95
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="xml" />
</td>
<td>
XML
</td>
<td>
$110.90
</td>
</tr>
</div>
</table><br /><br />

Enter your secret bonus code:
<input type="password" name="bonusCodeBox" size="30" /><br />

<div class="centered"><input type="button" name="enrollNowButton" value="Enroll Now" onClick="enrollStudent(document.onlineEnrollment)" /></div>

</div>

<div class="right">

<textarea rows="25" cols="50" name="ouputResults" readonly></textarea>

</div>

</form>

</div>

</body>

</html>



Stylesheet:


div.title {
font-size: large;
font-weight: 800;
}
div.subtitle {
font-weight: 800;
}
div.centered {
text-align: center;
}
body {
font-size: small;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
table {
font-size: small;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
div#leftright {
text-align: right;
width: 100%;
overflow: hidden;
}
div.right {
float: right;
/*width: 100%;
text-align: right;
overflow: hidden;*/
}
div.left {
float: left;
/*width: 50%;*/
}


I'm not too worried about the stylesheet, it doesn't have to look perfect...but for some reason it seems my functions aren't working, and I'm not sure how I'm supposed to "add formatting to the courseInfo variable" and have it display both the course name and price.

Any help would be really appreciated!! :)

pankaj.ghadge
12-08-2008, 07:02 AM
<html>
<head>
<title>Example Page</title>
<style>

div.title {
font-size: large;
font-weight: 800;
}
div.subtitle {
font-weight: 800;
}
div.centered {
text-align: center;
}
body {
font-size: small;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
table {
font-size: small;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
div#leftright {
text-align: right;
width: 100%;
overflow: hidden;
}
div.right {
float: right;
/*width: 100%;
text-align: right;
overflow: hidden;*/
}
div.left {
float: left;
/*width: 50%;*/
}

</style>



<script>
var coursePrice = new Array(1);
var courseCount = 0;
var subtotal=0;
var courseInfo;
var total=0;
var discountAmount=0;
function enrollStudent(f)
{
courseInfo = "";



if (f.aspNetForBeginners.checked)
{
courseInfo = "ASP.NET for Beginners - 130.00 \n";
coursePrice[0] = 130.00;
courseCount++;
}

if (f.aspNetAdvanced.checked)
{
courseInfo = courseInfo + "ASP.NET Advanced - 180.00 \n";
coursePrice[1] = 180.00;
courseCount++;
}

if (f.ajax.checked)
{
courseInfo = courseInfo + "AJAX - 100.95 \n";
coursePrice[2] = 100.95;
courseCount++;
}

if (f.xhtml.checked)
{
courseInfo = courseInfo + "XHTML - 100.95 \n";
coursePrice[3] = 100.95;
courseCount++;
}

if (f.xml.checked)
{
courseInfo = courseInfo + "XML - 110.90 \n";
coursePrice[4] = 110.90;
courseCount++;
}


if (courseCount == 0)
{
alert('No courses have been selected. Please select your courses and click the Enroll Now button.');
}
else
{
subtotal=calTotal();
applyDiscount();
printReceipt(document.onlineEnrollment);
}
}



function calTotal()
{
var subtotal = 0;
for(var i = 0; i < coursePrice.length; i++)
{
subtotal += coursePrice[i];
}
return subtotal;
}

function applyDiscount()
{

var discountAmount = "";

if (document.getElementById("bonusCodeBoxID").value = "1234")
{
if (courseCount > 3)
{
total = subtotal - coursePrice[2];
discountAmount = "- $" + coursePrice[2];
}
else if (courseCount > 2)
{
total = subtotal - (coursePrice[1] / 2);
discountAmount = "- $" + (coursePrice[1] / 2);
}
else if (courseCount > 1)
{
total = subtotal - (coursePrice[0] / 4);
discountAmount = "- $" + (coursePrice[0] / 4);
}
else if (courseCount == 1)
{
total = subtotal - 25;
discountAmount = "- $25.00";
}
}
else
{
discountAmount = "- $0";
}
}

function printReceipt(f)
{
document.onlineEnrollment.ouputResults.value = "Student Receipt \n \n"+ document.onlineEnrollment.firstNameBox.value + " " + document.onlineEnrollment.lastNameBox.value
+"\n"+document.onlineEnrollment.cityBox.value+ ", " + document.onlineEnrollment.selectProvince.options[document.onlineEnrollment.selectProvince.selectedIndex].value +"\n"+document.onlineEnrollment.streetBox.value +"\n"+ document.onlineEnrollment.postalCodeBox.value +"\n \n"+courseInfo+"\n \nSub Total: $" + subtotal +"\nDiscount: " + discountAmount +"\nTotal: $"+ total;


}


function handleErr(msg,url,l)
{
txt="There was an error on this page.\n\n";
txt+="Error: " + msg + "\n";
txt+="URL: " + url + "\n";
txt+="Line: " + l + "\n\n";
txt+="Click OK to continue.\n\n";
alert(txt);
return true;
}
onerror=handleErr;

</script>


</head>


<body>

<div id="leftright">

<div class="left">

<div class="title">Sign-up for the Following Online Web Programming Courses</div><br /><br />

<div class="subtitle">Please Enter your name and address:</div><br /><br />



<form name="onlineEnrollment">

&nbsp
First name:
<input type="text" name="firstNameBox" size="30" />

Last name:
<input type="text" name="lastNameBox" size="30" /><br />

&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
Street: <input type="text" name="streetBox" size="30" /><br />

&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
City:
<input type="text" name="cityBox" size="30" />

&nbsp&nbsp
Province:
<select name="selectProvince">
<option>Ontario</option>
<option>Alberta</option>
<option>British Columbia</option>
<option>Manitoba</option>
<option>Saskatchewan</option>
<option>New Brunswick</option>
<option>Nova Scotia</option>
<option>Prince Edward Island</option>
<option>Newfoundland & Labrador</option>
<option>Northwest Territories</option>
<option>Yukon</option>
<option>Nunavut</option>
</select><br />

Postal Code:
<input type="text" name="postalCodeBox" size="30" /><br /><br />

<div class="subtitle">Select the courses you would like to take and click the "Enroll Now" button.</div><br /><br />


<table name="courseTable" border="1px">
<div class="table">
<tr>
<td>
<input type="checkbox" name="aspNetForBeginners" />
</td>
<td>
ASP.NET for Beginners
</td>
<td>
$130.00
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="aspNetAdvanced" />
</td>
<td>
ASP.NET Advanced
</td>
<td>
$180.00
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="ajax" />
</td>
<td>
AJAX (Asynchronous JavaScript an XML)
</td>
<td>
$100.95
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="xhtml" />
</td>
<td>
XHTML
</td>
<td>
$100.95
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="xml" />
</td>
<td>
XML
</td>
<td>
$110.90
</td>
</tr>
</div>
</table><br /><br />

Enter your secret bonus code:
<input type="password" name="bonusCodeBox" size="30" id="bonusCodeBoxID" /><br />

<div class="centered">
<input type="button" name="enrollNowButton" value="Enroll Now" onClick="enrollStudent(document.onlineEnrollment)">
</div>
</div>
<div class="right">
<textarea rows="25" cols="50" name="ouputResults" readonly></textarea>

</div>

</form>

</div>

</body>

</html>

Iconoclast
12-08-2008, 07:36 AM
Hey, thanks a lot for your help! However, I still seem to be getting an error, and it looks like it's to do with the password box.

If I fill out the form, and leave the password box empty, it gives me this error:

Error: document.getElementById("bonusCodeBoxID") is null
Line: 90

And even if I put in the right code (1234), it still gives me the same error...help? =/

Iconoclast
12-08-2008, 08:13 AM
Ok, I updated some things, changed some things based on what other people told me. Here's the code I'm using now, but I've still got some problems (outlined at the bottom of my post):


<html>

<head>

<title>Test 2</title>

<link rel="stylesheet" type="text/css" href="stylesheet.css">



<script type="text/javascript">

var coursePrice = new Array(1);
var courseCount = 0;
var subtotal=0;
var courseInfo;
var total=0;
var discountAmount=0;

function enrollStudent(f)
{


if (f.aspNetForBeginners.checked)
{
courseInfo = "ASP.NET for Beginners - 130.00 \n";
coursePrice[0] = 130.00;
courseCount++;
}

if (f.aspNetAdvanced.checked)
{
courseInfo = courseInfo + "ASP.NET Advanced - 180.00 \n";
coursePrice[1] = 180.00;
courseCount++;
}

if (f.ajax.checked)
{
courseInfo = courseInfo + "AJAX - 100.95 \n";
coursePrice[2] = 100.95;
courseCount++;
}

if (f.xhtml.checked)
{
courseInfo = courseInfo + "XHTML - 100.95 \n";
coursePrice[3] = 100.95;
courseCount++;
}

if (f.xml.checked)
{
courseInfo = courseInfo + "XML - 110.90 \n";
coursePrice[4] = 110.90;
courseCount++;
}


if (courseCount == 0)
{
alert('No courses have been selected. Please select your courses and click the Enroll Now button.');
}
else
{
calTotal();
applyDiscount();
printReceipt(document.onlineEnrollment);
}
}



function calTotal()
{
for(var i = 0; i < coursePrice.length; i++)
{
subtotal += coursePrice[i];
}
return total
}

function applyDiscount()
{
if (document.onlineEnrollment.bonusCodeBox.value = "1234")
{
if (courseCount > 3)
{
total = subtotal - coursePrice[2];
discountAmount = "- $" + coursePrice[2];
}
else if (courseCount > 2)
{
total = subtotal - (coursePrice[1] / 2);
discountAmount = "- $" + (coursePrice[1] / 2);
}
else if (courseCount > 1)
{
total = subtotal - (coursePrice[0] / 4);
discountAmount = "- $" + (coursePrice[0] / 4);
}
else if (courseCount == 1)
{
total = subtotal - 25;
discountAmount = "- $25.00";
}
}
else
{
discountAmount = "- $0";
}
}

function printReceipt(f)
{
f.outputResults.value = "Student Receipt \n \n" + f.firstNameBox.value + " " + f.lastNameBox.value + "\n" + f.cityBox.value + ", " + f.selectProvince.options[f.selectProvince.selectedIndex].value + "\n" + f.streetBox.value + f.postalCodeBox.value + "\n\n" + courseInfo + "\n\n" + "Sub Total: $" + subtotal + "\n" + "Discount: " + discountAmount + "\n" + "Total: $" + total;
}


function handleErr(msg,url,l)
{
txt="There was an error on this page.\n\n";
txt+="Error: " + msg + "\n";
txt+="URL: " + url + "\n";
txt+="Line: " + l + "\n\n";
txt+="Click OK to continue.\n\n";
alert(txt);
return true;
}
onerror=handleErr;

</script>


</head>


<body>

<div id="leftright">

<div class="left">

<div class="title">Sign-up for the Following Online Web Programming Courses</div><br /><br />

<div class="subtitle">Please Enter your name and address:</div><br /><br />



<form name="onlineEnrollment">

&nbsp
First name:
<input type="text" name="firstNameBox" size="30" />

Last name:
<input type="text" name="lastNameBox" size="30" /><br />

&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
Street: <input type="text" name="streetBox" size="30" /><br />

&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
City:
<input type="text" name="cityBox" size="30" />

&nbsp&nbsp
Province:
<select name="selectProvince">
<option>Ontario</option>
<option>Alberta</option>
<option>British Columbia</option>
<option>Manitoba</option>
<option>Saskatchewan</option>
<option>New Brunswick</option>
<option>Nova Scotia</option>
<option>Prince Edward Island</option>
<option>Newfoundland & Labrador</option>
<option>Northwest Territories</option>
<option>Yukon</option>
<option>Nunavut</option>
</select><br />

Postal Code:
<input type="text" name="postalCodeBox" size="30" /><br /><br />

<div class="subtitle">Select the courses you would like to take and click the "Enroll Now" button.</div><br /><br />


<table name="courseTable" border="1px">
<div class="table">
<tr>
<td>
<input type="checkbox" name="aspNetForBeginners" />
</td>
<td>
ASP.NET for Beginners
</td>
<td>
$130.00
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="aspNetAdvanced" />
</td>
<td>
ASP.NET Advanced
</td>
<td>
$180.00
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="ajax" />
</td>
<td>
AJAX (Asynchronous JavaScript an XML)
</td>
<td>
$100.95
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="xhtml" />
</td>
<td>
XHTML
</td>
<td>
$100.95
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="xml" />
</td>
<td>
XML
</td>
<td>
$110.90
</td>
</tr>
</div>
</table><br /><br />

Enter your secret bonus code:
<input type="password" name="bonusCodeBox" size="30" /><br />

<div class="centered"><input type="button" name="enrollNowButton" value="Enroll Now" onClick="enrollStudent(document.onlineEnrollment)" /></div>

</div>

<div class="right">

<textarea rows="25" cols="50" name="outputResults" readonly></textarea>

</div>

</form>

</div>

</body>

</html>

I added a section in the JavaScript to display a message box for errors, since I was having a lot of trouble with them.

The main problem I seem to be having now is that when I select checkboxes that AREN'T in order (for example, picking ASP.Net for Beginners and XML, the output is some sort of error as it displays the Sub Total and Total as "NaN" (whatever that means). Any ideas? Thanks again!! :D

pankaj.ghadge
12-09-2008, 06:55 AM
<html>
<head>
<title>Example Page</title>
<style>

div.title {
font-size: large;
font-weight: 800;
}
div.subtitle {
font-weight: 800;
}
div.centered {
text-align: center;
}
body {
font-size: small;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
table {
font-size: small;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
div#leftright {
text-align: right;
width: 100%;
overflow: hidden;
}
div.right {
float: right;
/*width: 100%;
text-align: right;
overflow: hidden;*/
}
div.left {
float: left;
/*width: 50%;*/
}

</style>



<script>
var coursePrice = new Array(1);
var courseCount = 0;
var subtotal=0;
var courseInfo;
var total=0;
var discountAmount="";
function enrollStudent(f)
{
courseInfo = "";



if (f.aspNetForBeginners.checked)
{
courseInfo = "ASP.NET for Beginners - 130.00 \n";
coursePrice[0] = 130.00;
courseCount++;
}

if (f.aspNetAdvanced.checked)
{
courseInfo = courseInfo + "ASP.NET Advanced - 180.00 \n";
coursePrice[1] = 180.00;
courseCount++;
}

if (f.ajax.checked)
{
courseInfo = courseInfo + "AJAX - 100.95 \n";
coursePrice[2] = 100.95;
courseCount++;
}

if (f.xhtml.checked)
{
courseInfo = courseInfo + "XHTML - 100.95 \n";
coursePrice[3] = 100.95;
courseCount++;
}

if (f.xml.checked)
{
courseInfo = courseInfo + "XML - 110.90 \n";
coursePrice[4] = 110.90;
courseCount++;
}


if (courseCount == 0)
{
alert('No courses have been selected. Please select your courses and click the Enroll Now button.');
}
else
{
subtotal=calTotal();
applyDiscount();
printReceipt(document.onlineEnrollment);
}
}



function calTotal()
{
var subtotal = 0;
for(var i = 0; i < coursePrice.length; i++)
{
subtotal += coursePrice[i];
}
return subtotal;
}

function applyDiscount()
{

if (document.getElementById("bonusCodeBoxID").value =="1234")
{
//alert("1234");
if (courseCount > 3)
{
total = subtotal - coursePrice[2];
discountAmount = "- $" + coursePrice[2];
}
else if (courseCount > 2)
{
total = subtotal - (coursePrice[1] / 2);
discountAmount = "- $" + (coursePrice[1] / 2);
}
else if (courseCount > 1)
{
total = subtotal - (coursePrice[0] / 4);
discountAmount = "- $" + (coursePrice[0] / 4);
}
else if (courseCount == 1)
{
total = subtotal - 25;
discountAmount = "- $25.00";
}
alert(discountAmount);
}
else
{
discountAmount = "- $0";
}
}

function printReceipt(f)
{
document.onlineEnrollment.ouputResults.value = "Student Receipt \n \n"+ document.onlineEnrollment.firstNameBox.value + " " + document.onlineEnrollment.lastNameBox.value
+"\n"+document.onlineEnrollment.cityBox.value+ ", " + document.onlineEnrollment.selectProvince.options[document.onlineEnrollment.selectProvince.selectedIndex].value +"\n"+document.onlineEnrollment.streetBox.value +"\n"+ document.onlineEnrollment.postalCodeBox.value +"\n \n"+courseInfo+"\n \nSub Total: $" + subtotal +"\nDiscount: " + discountAmount +"\nTotal: $"+ total;


}


function handleErr(msg,url,l)
{
txt="There was an error on this page.\n\n";
txt+="Error: " + msg + "\n";
txt+="URL: " + url + "\n";
txt+="Line: " + l + "\n\n";
txt+="Click OK to continue.\n\n";
alert(txt);
return true;
}
onerror=handleErr;

</script>


</head>


<body>

<div id="leftright">

<div class="left">

<div class="title">Sign-up for the Following Online Web Programming Courses</div><br /><br />

<div class="subtitle">Please Enter your name and address:</div><br /><br />



<form name="onlineEnrollment">

&nbsp
First name:
<input type="text" name="firstNameBox" size="30" />

Last name:
<input type="text" name="lastNameBox" size="30" /><br />

&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
Street: <input type="text" name="streetBox" size="30" /><br />

&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
City:
<input type="text" name="cityBox" size="30" />

&nbsp&nbsp
Province:
<select name="selectProvince">
<option>Ontario</option>
<option>Alberta</option>
<option>British Columbia</option>
<option>Manitoba</option>
<option>Saskatchewan</option>
<option>New Brunswick</option>
<option>Nova Scotia</option>
<option>Prince Edward Island</option>
<option>Newfoundland & Labrador</option>
<option>Northwest Territories</option>
<option>Yukon</option>
<option>Nunavut</option>
</select><br />

Postal Code:
<input type="text" name="postalCodeBox" size="30" /><br /><br />

<div class="subtitle">Select the courses you would like to take and click the "Enroll Now" button.</div><br /><br />


<table name="courseTable" border="1px">
<div class="table">
<tr>
<td>
<input type="checkbox" name="aspNetForBeginners" />
</td>
<td>
ASP.NET for Beginners
</td>
<td>
$130.00
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="aspNetAdvanced" />
</td>
<td>
ASP.NET Advanced
</td>
<td>
$180.00
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="ajax" />
</td>
<td>
AJAX (Asynchronous JavaScript an XML)
</td>
<td>
$100.95
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="xhtml" />
</td>
<td>
XHTML
</td>
<td>
$100.95
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="xml" />
</td>
<td>
XML
</td>
<td>
$110.90
</td>
</tr>
</div>
</table><br /><br />

Enter your secret bonus code:
<input type="password" name="bonusCodeBox" size="30" id="bonusCodeBoxID" /><br />

<div class="centered">
<input type="button" name="enrollNowButton" value="Enroll Now" onClick="enrollStudent(document.onlineEnrollment)">
</div>
</div>
<div class="right">
<textarea rows="25" cols="50" name="ouputResults" readonly></textarea>

</div>

</form>

</div>

</body>

</html>

Iconoclast
12-09-2008, 07:21 AM
I still get Not a Number for the subtotal and total values =/

pankaj.ghadge
12-09-2008, 09:22 AM
It works well in firefox but i don't have IE to test...................
Or may be u r doing some calculation wrong .......................................

function applyDiscount()
{

if (document.getElementById("bonusCodeBoxID").value =="1234")
{
//alert("1234");
if (courseCount > 3)
{
total = subtotal - coursePrice[2];
discountAmount = "- $" + coursePrice[2];
}
else if (courseCount > 2)
{
total = subtotal - (coursePrice[1] / 2);
discountAmount = "- $" + (coursePrice[1] / 2);
}
else if (courseCount > 1)
{
total = subtotal - (coursePrice[0] / 4);
discountAmount = "- $" + (coursePrice[0] / 4);
}
else if (courseCount == 1)
{
total = subtotal - 25;
discountAmount = "- $25.00";
}
alert(discountAmount);
}
else
{
total=subtotal;
discountAmount = "- $0";
}
}


Replace this function u didn't add the total = subtotal in else ..........