I'm trying to create a form for a friend of mine and need some help with javascript. I'm new to javascript so it isn't going very smoothly.
What I'm trying to do now is have a dropbox with several packages for sale which each have a number value (price) which, when selected, will send that number to the Subtotal box and calculate the rest automatically. I need this to update when you change the dropbox option.
Here's what I've come up with. As you can tell I'm a bit (a lot) lost. The dropdown box and checkboxes add to the Subtotal fine but there's a couple problems.
1. Subtotal value does not trigger the Tax and Total auto-calculation.
2. onMouseDown for dropbox options just tallies the price each time you click an option, it doesn't replace with it's single value.
<html>
<head>
<title>Untitled Document</title>
<script LANGUAGE="JavaScript">
<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->
<!-- Original: Paul DeBrino -->
<!-- Web Site: http://infinity-rd.com -->
<!-- Begin
function CheckChoice(whichbox)
{
with (whichbox.form)
{
//Handle differently, depending on type of input box.
if (whichbox.type == "select")
{
//First, back out the prior radio selection's price from the total:
hiddentotal.value = eval(hiddentotal.value) - eval(hiddenpriorselect.value);
//Then, save the current radio selection's price:
hiddenpriorselect.value = eval(whichbox.price);
//Now, apply the current radio selection's price to the total:
hiddentotal.value = eval(hiddentotal.value) + eval(whichbox.price);
}
else
{
//If box was checked, accumulate the checkbox value as the form total,
//Otherwise, reduce the form total by the checkbox value:
if (whichbox.checked == false)
{ hiddentotal.value = eval(hiddentotal.value) - eval(whichbox.value); }
else { hiddentotal.value = eval(hiddentotal.value) + eval(whichbox.value); }
}
//Ensure the total never goes negative (some browsers allow radiobutton to be deselected):
if (hiddentotal.value < 0)
{
InitForm();
}
//Now, return with formatted total:
return(formatCurrency(hiddentotal.value));
}
}
//Define function to format a value as currency:
function formatCurrency(num)
{
// Courtesy of http://www7.brinkster.com/cyanide7/
num = num.toString().replace(/\$|\,/g,'');
if(isNaN(num))
num = "0";
sign = (num == (num = Math.abs(num)));
num = Math.floor(num*100+0.50000000001);
cents = num%100;
num = Math.floor(num/100).toString();
if(cents<10)
cents = "0" + cents;
for (var i = 0; i < Math.floor((num.length-(1+i))/3); i++)
num = num.substring(0,num.length-(4*i+3))+','+
num.substring(num.length-(4*i+3));
return (((sign)?'':'-') + '' + num + '.' + cents);
}
//Define function to init the form on reload:
function InitForm()
{
//Reset the displayed total on form:
document.form1.Subtotal.value='0';
document.form1.hiddentotal.value=0;
document.form1.hiddenpriorradio.value=0;
//Set all checkboxes and radio buttons on form-1 to unchecked:
for (xx=0; xx < document.form1.elements.length; xx++)
{
if (document.form1.elements[xx].type == 'checkbox' | document.form1.elements[xx].type == 'radio')
{
document.form1.elements[xx].checked = false;
}
}
}
function totalprice()
{
a = document.form1.Subtotal.value
b = (Math.round((a * 0.0825) / .01) * .01)
c = (a * 1) + (b * 1)
document.form1.Tax.value = b
document.form1.Total.value = c
}
</script>
</head>
<body onLoad="InitForm();" onreset="InitForm();">
<table width="220" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><form method="post" name="form1">
<div align="right">
<select name="Type of shoot">
<option name="Please Choose" value="Please Choose" selected>Please Choose</option>
<option name="CD Coverage 1.5 hours" value=525 onMouseDown="form1.Subtotal.value=CheckChoice(this);">Option 1</option>
<option name="CD Coverage 3 hours" value=990 onMouseDown="form1.Subtotal.value=CheckChoice(this);">Option 2</option>
<option name="CD Coverage 6 hours" value=1650 onMouseDown="form1.Subtotal.value=CheckChoice(this);">Option 3</option>
<option name="CD Coverage 9 hours" value=2500 onMouseDown="form1.Subtotal.value=CheckChoice(this);">Option 4</option>
</select><br><br>
Addon #1 - $20 <input type="checkbox" name="Addon1" value=20 onclick="form1.Subtotal.value=CheckChoice(this);"><br>
Addon #2 - $50 <input type="checkbox" name="Addon2" value=50 onclick="form1.Subtotal.value=CheckChoice(this);"><br>
Addon #3 - $70 <input type="checkbox" name="Addon2" value=70 onclick="form1.Subtotal.value=CheckChoice(this);">
<br>
<br>
<br>
<strong><u>Price</u></strong><br />
<input type="hidden" name="hiddentotal" value=0>
<input type="hidden" name="hiddenpriorradio" value=0>
$<input type="text" name="Subtotal" size="10" readonly onFocus="this.blur();" onChange="totalprice();">
<br />
Sales Tax (8.75%): $<input name="Tax" size="10" readonly="true" />
<br />
Total: $<input name="Total" size="10" readonly="true" />
<br /></div><input type="hidden" name="hiddentotal" value=0>
<input type="hidden" name="hiddenpriorradio" value=0>
</form>
</td>
</tr>
</table>
</body>
</html>
Any help at all is much appreciated.
11 Oct, 2008 - 03:52 PM
) The value is a string and often contains a comma, so they need to be removed and converted to an integer, but i think the a = line is pretty self explanatory. Hope this helps 
| 