My js function not adding perfectly

[eloginko]

As you can see there is a value already on the (total)textbox which i filtered on a table...and if i type a number on the (score)textboxes it will automatically add on the current value of the total(textbox).

 

My problem is its not adding perfectly.

 

example:

 

http://s38.photobucket.com/user/eloginko/media/score_zps43f9daaa.jpg.html

 

 

 

html code:

 

<form id="frm" name="frm" />

<table>

<tr>

<td>

Name: <br />

<input type="text" name="name" value="<?php if(empty($name[0])){$name[0] = array(NULL);}else{echo $name[0];} ?>" readonly /> <br />

</td>

<td>

Score 1: <br />

<input type="text" name="optA" value="" onchange="optTotal()" /> <br />

</td>

<td>

Score 2: <br />

<input type="text" name="optB" value="" onchange="optTotal()" /> <br />

</td>

<td>

Score 3: <br />

<input type="text" name="optC" value="" onchange="optTotal()" /> <br />

</td>

<td>

Score 4: <br />

<input type="text" name="optD" value="" onchange="optTotal()" /> <br />

</td>

<td>

Total: <br />

<input type="text" name="totals" value="<?php if(empty($total[0])){$total[0] = array(NULL);}else{echo $total[0];} ?>" readonly onKeyUp="optTotal()" /> <br />

</td>

</form>

 

 

total calculation script:

 

<script>

function optTotal() {

var a1 = document.forms[0].optA;

var b1 = document.forms[0].optB;

var c1 = document.forms[0].optC;

var d1 = document.forms[0].optD;

var xtotal = document.forms[0].totals;

if (a1.value && a1.value != "")

a1 = parseFloat(a1.value);

else

a1 = 0;

 

if (b1.value && b1.value != "")

b1 = parseFloat(b1.value);

else

b1 = 0;

 

if (c1.value && c1.value != "")

c1 = parseFloat(c1.value);

else

c1 = 0;

 

if (d1.value && d1.value != "")

d1 = parseFloat(d1.value);

else

d1 = 0;

if (xtotal.value && xtotal.value != "")

xtotal = parseFloat(xtotal.value);

else

xtotal = 0;

 

var total = a1 + b1 + c1 + d1 + xtotal;

document.forms[0].totals.value = total;

 

}

</script>

[kicken]

When you change it to 5 you get 15 because the value of your total field is 10. 10 + 5 = 15. It's adding just fine.

 

I'm assuming what you intended is for it to always use the original total value (ie when adding. If that is the case, you should be able to get that value using the .defaultValue property rather than the .value property. .defaultValue contains whatever value the control was initialized with using the value="" attribute in the HTML.

 

Lastly, whenver you post your code here, make sure you wrap it in

tags so that it is formatted nicely and preserves indentation.

Edited January 28, 2014 by kicken