Click to See Complete Forum and Search --> : calculator script works but gives unwanted results


lessdangerous
07-05-2005, 04:08 PM
I'm pretty much a beginner to javascript and can read the stuff better than I can write it. That being said, I've put together a script to work with a form that'll calculate the cost of a shirt based on quantity and color. For the most part it works, but I have a few questions:

1) When I type in the first box (quantity) a digit between 2 and 9 I get something completely wrong from what I'm supposed to get, which usally is a "NaN". The numbers 1, and 10 through 47 work like they're supposed to. Why doesn't it work for numbers 2-9?

2) When I do put in a good number to work with and select a color, sometimes when the price should be something like "7.50" it actually spits out "7.5". Why does it leave off the zeroes at the end of numbers and how can I prevent it?

<html>
<head>
<script>
<!--
function getPrice(formName){

var myForm = formName.name;
var COLOR = formName.shirtcolor;
var QTY = formName.quantity;
var COLORPRICE;
var QTYPRICE;
var QUOTEPRICE;

if ( myForm == "calculator" ){
if ((QTY.value >= "1" ) && (QTY.value <= "11" )){
QTYPRICE = "27.50";
}
if ((QTY.value >= "12" ) && (QTY.value <= "23" )){
QTYPRICE = "7.50";
}
if ((QTY.value >= "24" ) && (QTY.value <= "47" )){
QTYPRICE = "6.75";
}
if ( COLOR.value == "White" ){
COLORPRICE = "0.00";
}
if ( COLOR.value == "Light" ){
COLORPRICE = "0.50";
}
if ( COLOR.value == "Dark" ){
COLORPRICE = "1.00";
}
}
QUOTEPRICE = parseFloat(QTYPRICE) + parseFloat(COLORPRICE);
formName.display.value = QUOTEPRICE;
}
// -->
</script>
</head>
<body>

<form name="calculator">

<input type=text name="quantity" size="2">

<select name="shirtcolor">
<option selected>
<option value="White">White</option>
<option value="Light">Ash</option>
<option value="Dark">Black</option>
</select>

<input type="button" value="Calculate Quote" onClick="getPrice(this.form)">

<input type="text" name="display" size="7">

</form>

</body>
</html>

Mongus
07-05-2005, 05:00 PM
When you put a number in quotes JavaScript evaluates it as a string not a number. When you do comparisons between strings it is done based on the alphabet. Just remove the quotes from your numbers.

if ( myForm == "calculator" ){
if ((QTY.value >= 1 ) && (QTY.value <= 11 )){
QTYPRICE = 27.50;
}
if ((QTY.value >= 12 ) && (QTY.value <= 23 )){
QTYPRICE = 7.50;
}
if ((QTY.value >= 24 ) && (QTY.value <= 47 )){
QTYPRICE = 6.75;
}
if ( COLOR.value == "White" ){
COLORPRICE = 0.00;
}
if ( COLOR.value == "Light" ){
COLORPRICE = 0.50;
}
if ( COLOR.value == "Dark" ){
COLORPRICE = 1.00;
}
}


Numbers will trim all trailing 0s. To add them back in you can convert your number to a string then add 0s till you've got enough:

QUOTEPRICE = "" + parseFloat(QTYPRICE) + parseFloat(COLORPRICE);
if (QUOTEPRICE.indexOf('.') == -1)
QUOTEPRICE += ".00";
else
while (QUOTEPRICE.length - QUOTEPRICE.indexOf('.') < 3)
QUOTEPRICE += "0";
formName.display.value = QUOTEPRICE;