Javascript difficulties...

[kenrogers]

Could someone have a look at this form and guess as to why the calculation doesn't work? Or could you redirect me to a good source of help?

http://www3.telus.net/sprecious/Faulty_form.htm

The above link is a stripped-down version of my troublesome order form. I've renamed all products to remain anonymous. This form is designed to calculate an order total including taxes, which depend on your Canadian province.

Taxes are properly calculated, but the condiment total and the grand total are wrong. All functions have previously worked. Here are the two I just added (which don't work). Can anyone see any immediately obvious syntax errors?







function calculate_total()
{
switch(document.myform.state.value)
{
case "Alberta":
var gst_perc=".07";
var pst_perc=".00";
var pack_quantity =
document.myform.west_pack.value +
document.myform.prarie_pack.value +
document.myform.cent_pack.value +
document.myform.east_pack.value +
document.myform.alta_pack.value;
document.myform.map_pack_subtotal.value = calculate_map_packs(pack_quantity);
document.myform.grand_subtotal.value =
document.myform.product_subtotal.value +
document.myform.map_pack_subtotal.value;
document.myform.gst.value = document.myform.grand_subtotal.value * gst_perc;
document.myform.pst.value = document.myform.grand_subtotal.value * pst_perc;
document.myform.grand_total.value =
document.myform.grand_subtotal.value +
document.myform.gst.value +
document.myform.pst.value +
document.myform.shipping.value;
setupFields()
break
-----the switch statement repeats the above code for all 13 provinces-----










function calculate_map_packs(var1)
{
var x = 0;
switch(var1)
{
case 0:
x = 0;
break
case 1:
x = 0;
break
case 2:
x = 39.95;
break
case 3:
x = 79.90;
break
case 4:
x = 119.85;
break
case 5:
x = 159.8;
break
default:
}
return x
}

 

[trollacious]

This:

document.myform.west_pack.value + 
document.myform.prarie_pack.value + 
document.myform.cent_pack.value + 
document.myform.east_pack.value + 
document.myform.alta_pack.value;

should be

(document.myform.west_pack.value * 1) + 
(document.myform.prarie_pack.value * 1) + 
(document.myform.cent_pack.value * 1) + 
(document.myform.east_pack.value * 1) + 
(document.myform.alta_pack.value * 1);

because element values default to string variables. To add them together rather than concatenate the strings, you need to force the values to be numeric.

You'll need the same conversion for the other set of form input values you add together.

Lee

 

[kenrogers]

Thank you, that has resolved the "Grand Total" malfunction. However, the "condiments" total is in error. I suspect a problem with the "calculate_map_packs" function. Here's my script below for this function. Regardless of how many selections the customer makes, this function returns $159.80.

function calculate_map_packs(var1)
{
var x = 0;
switch(var1)
{
case 0:
x = 0;
break
case 1:
x = 0;
break
case 2:
x = 39.95;
break
case 3:
x = 79.90;
break
case 4:
x = 119.85;
break
case 5:
x = 159.8;
break
default:
}
return x
}

 

[trollacious]

Try this for your function. You can also put an alert to see what value is actually being passed to the function.

function calculate_map_packs (var1)                 
{
var1 *= 1;                         

if (var1 < 1) return 0;

return (var1 - 1) * 39.95;
}

Lee

 

[kenrogers]

Thanks, trollacious. I find your function code to be much simpler than my switch statement. However, I am still getting 159.80 total, regardless of the number of boxes checked, and I think I know why. I have assigned a value of 1 to each of the checkboxes, but instead, I only want the checkbox to have such a value if it is clicked. Here's the code from my form.

<TD height="25" colspan="2" bgcolor="dddddd"> <input name="west_pack" type="checkbox" id="west_pack" value=1>
Western Condiment</TD>
<TD colspan="2" rowspan="5" valign="middle" bgcolor="dddddd"><div align="center"></div></TD>
</TR>
<TR>
<TD height="26" colspan="2" bgcolor="dddddd"> <input name="prarie_pack" type="checkbox" id="prarie_pack" value=1>
Prairie Condiment</TD>
</TR>
<TR>
<TD height="26" colspan="2" bgcolor="dddddd"> <input name="cent_pack" type="checkbox" id="cent_pack" value=1>
Central Condiment</TD>
</TR>
<TR>
<TD height="26" colspan="2" bgcolor="dddddd"> <input name="east_pack" type="checkbox" id="east_pack" value=1>
Eastern Condiment</TD>
</TR>
<TR>
<TD height="27" colspan="2" bgcolor="dddddd"> <input name="alta_pack" type="checkbox" id="alta_pack" value=1>
Atlantic Condiment</TD>
</TR>

 

[trollacious]

This should take care of what you want, and be flexible enough to handle additional packs, as long as you have "_pack" in the checkbox name:

function calculate_map_packs ()                 
{
var numpacks = 0;
var els = document.forms['formname'].elements;

for (var ei = 0; ei < els.length; ei++)
  {
  var oneel = els[ei];
  if (oneel.type == 'checkbox' && oneel.name.indexOf('_pack') > -1)
    {
    if (oneel.checked == true) numpacks++;
    }
  }

if (numpacks < 1) return 0;

return (numpacks - 1) * 39.95;
}

Lee

 

[kenrogers]

Thank you, trollacious. This works perfectly. I was really stuck, there.

Kenny

 

[trollacious]

No use making it any more complex than necessary. #

Lee