Forum Moderators: open

Message Too Old, No Replies

Calculate form not working properly

         

msullens73

4:46 pm on Feb 9, 2010 (gmt 0)

10+ Year Member



I've been asked to fix a page that contains a calculating form which assigns a quote number. I've no idea why this isn't working though, can someone please take a look and help me figure this out? Here's the code:
<script language="JavaScript" type="text/javascript">
var i=1;
function randValue(maxVal,no_of_time)
{
i++;
document.getElementById('random').innerHTML='';
var theNumber = (Math.random()*parseInt(maxVal));
document.getElementById('random').innerHTML=theNumber;
if(i<=no_of_time)
setTimeout("randvalue("+maxVal+","+no_of_time+")",3000000);
else
i=1;
}
function quantity1()
{
var mylist1=document.getElementById("myList1");
document.getElementById("favorite1").value=0;
document.getElementById("favorite1").value= (parseInt(mylist1.options[mylist1.selectedIndex].text)*39.00).toFixed(2); }
function quantity2()
{
var mylist2=document.getElementById("myList2");
document.getElementById("favorite2").value=0;
document.getElementById("favorite2").value= (parseInt(mylist2.options[mylist2.selectedIndex].text)*66.99).toFixed(2); }
function quantity3()
{
document.getElementById('favorite3').value=
parseFloat(document.getElementById("favorite1").value)+
parseFloat(document.getElementById("favorite2").value)+
parseFloat(document.getElementById("favorite3").value)
}
</script>
</head>
<body>
<form action="" method="POST" name="Quote">
<table>
<tr><td>description</td><td>item no</td><td><select name="Quantity" size="1" id="myList1" onChange="quantity1()">
<option>0</option><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option></select></td><td>$ 39.00</td><td> <input readonly="readonly" type="text" id="favorite1" size="13" value="0" name="favorite1"></td></tr>
<tr><td>description</td><td>item no</td><td><select name="Quantity" size="1" id="myList2" onChange="quantity2()">
<option>0</option><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option></select></td><td>$ 66.99</td><td><input readonly="readonly" type="text" id="favorite2" size="13" value="0" name="favorite2"></td></tr>
<tr><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td><span><input name="button" type="button" onClick="quantity3()" value="Total Quote"></span></td><td>$ <input readonly="readonly" type="text" id="favorite3" size="13" name="favorite3"> </td></tr>
<tr><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td><input name="button" type="button" value="Quote Number" onClick="randValue"></td><td>&nbsp;&nbsp;
<input readonly="readonly" type="text" id="randValue" size="13" name="randValue"></td></tr></table>
</form>
</body>
</html>

rocknbil

8:10 pm on Feb 9, 2010 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Welcome aboard msullens73, the problem, and "one way" to (sorta) fix it is here.

<input readonly type="text" id="favorite3" size="13" name="favorite3" value="0.00">

When you add favorite 1, 2, and 3, parseFloat on your original favorite3 is null/undefined, so all together = NaN.

Another and more reliable way:


function quantity3() {
var tot=0;
for (j=1;j<4;j++) {
var nm = 'favorite'+j;
if (document.getElementById(nm)) {
if (document.getElementById(nm).value > 0) {
tot += parseFloat(document.getElementById(nm).value);
}
}
}
document.getElementById('favorite3').value = (tot > 0)?tot.toFixed(2):'0.00';
}


Bookmark this thread [webmasterworld.com], you're not experiencing them now, but at some point, when working with floating point numbers eventually you will encounter issues.