CodingForums.com - How to add up dynamic totals?

CodingForums.com (http://www.codingforums.com/index.php)

- JavaScript programming (http://www.codingforums.com/forumdisplay.php?f=2)

- - How to add up dynamic totals? (http://www.codingforums.com/showthread.php?t=284904)

How to add up dynamic totals?

I haveI have ten functions (I know this is a drawn out way of coding) and the last function doesn't work.

Its supposed to total up the result of the first 9 functions, but it doesn't change my input at all.

can I resolve this?

Code:



<script type="text/javascript">

function updatesuma(){ document.form.suma.value =(document.form.sum1a.value-0)- (document.form.sum2a.value -0); }*

function updatesumb(){ document.form.sumb.value =(document.form.sum1b.value-0)- (document.form.sum2b.value -0); }*

function updatesumc(){ document.form.sumc.value =(document.form.sum1c.value-0)- (document.form.sum2c.value -0); }*

function updatesumd(){ document.form.sumd.value =(document.form.sum1d.value-0)- (document.form.sum2d.value -0); }

function updatesume(){ document.form.sume.value =(document.form.sum1e.value-0)- (document.form.sum2e.value -0); }*

function updatesumf(){ document.form.sumf.value =(document.form.sum1f.value-0)- (document.form.sum2f.value -0); }

function updatesumg(){ document.form.sumg.value =(document.form.sum1g.value-0)- (document.form.sum2g.value -0); }*

function updatesumh(){ document.form.sumh.value =(document.form.sum1h.value-0)- (document.form.sum2h.value -0); }

function updatesumi(){ document.form.sumi.value =(document.form.sum1i.value-0)- (document.form.sum2i.value -0); } *



function updatesumtotal(){*

document.form.sumtotal.value =

(document.form.suma.value -0)+*

(document.form.sumb.value -0)+

(document.form.sumc.value -0)+*

(document.form.sumd.value -0)+

(document.form.sume.value -0)+*

(document.form.sumf.value -0)+

(document.form.sumg.value -0)+*

(document.form.sumh.value -0)+

(document.form.sumi.value -0)*

; }*

</script>



*<form name="form"> *



<input type="text" autocomplete="off" name="Scores" * *id="Score" * * value="Score" *class="clip" * readonly style="border:0px" />

<input type="text" autocomplete="off" name="Par" * * * id="Par" * * * value="Par" * *class="clip" * readonly style="border:0px" />

<input type="text" * * * * * * * * * *name="Par Score" id="Par Score" value="Total" *class="clip" * readonly style="border:0px" /><br>



<input type="text" autocomplete="off" *name="sum1a" id="hole1A" value="" onChange= "updatesuma()" />*

<input type="text" autocomplete="off" name="sum2a" readonly value="<?php echo $par1;?>" *id="hole1B" onChange= "updatesuma()" />*

<input type="text" name="suma" value="" id="hole1result" readonly style="" onChange= "updatesumtotal()" > <br>



<input type="text" autocomplete="off" name="sum1b" id="hole2A" value="" onChange= "updatesumb()" />*

<input type="text" autocomplete="off" name="sum2b" readonly value="<?php echo $par2;?>" id="hole2B" onChange= "updatesumb()" />*

<input type="text" name="sumb" value="" id="hole2result" readonly style="" onChange= "updatesumtotal()" > <br>



<input type="text" autocomplete="off" name="sum1c" id="hole3A" value="" onChange= "updatesumc()" />*

<input type="text" autocomplete="off" name="sum2c" readonly value="<?php echo $par3;?>" id="hole3B" onBlur= "updatesumc()" />*

<input type="text" name="sumc" value="" id="hole3result" readonly style="" onChange= "updatesumtotal()" > <br>



<input type="text" autocomplete="off" name="sum1d" id="hole4A" value="" onChange= "updatesumd()" />*

<input type="text" autocomplete="off" name="sum2d" readonly value="<?php echo $par4;?>" id="hole4B" onChange= "updatesumd()" />*

<input type="text" name="sumd" value="" id="hole4result" readonly style="" onChange= "updatesumtotal()" > <br>



<input type="text" autocomplete="off" name="sum1e" id="hole5A" value="" onChange= "updatesume()" />*

<input type="text" autocomplete="off" name="sum2e" readonly value="<?php echo $par5;?>" id="hole5B" onChange= "updatesume()" />*

<input type="text" name="sume" value="" id="hole5result" readonly style="" onChange= "updatesumtotal()" > <br>





<input type="text" autocomplete="off" name="sum1f" id="hole6A" value="" onChange= "updatesumf()" />*

<input type="text" autocomplete="off" name="sum2f" readonly value="<?php echo $par6;?>" id="hole6B" onChange= "updatesumf()" />*

<input type="text" name="sumf" value="" id="hole6result" readonly style="" onChange= "updatesumtotal()" > <br>



<input type="text" autocomplete="off" name="sum1g" id="hole7A" value="" onChange= "updatesumg()" />*

<input type="text" autocomplete="off" name="sum2g" readonly value="<?php echo $par7;?>" id="hole7B" onChange= "updatesumg()" />*

<input type="text" name="sumg" value="" id="hole7result" readonly style="" *onChange= "updatesumtotal()" > <br>



<input type="text" autocomplete="off" name="sum1h" id="hole8A" value="" onChange= "updatesumh()" />*

<input type="text" autocomplete="off" name="sum2h" readonly value="<?php echo $par8;?>" id="hole8B" onChange= "updatesumh()" />*

<input type="text" name="sumh" value="" id="hole8result" readonly style="" onChange= "updatesumtotal()" > <br>



<input type="text" autocomplete="off" name="sum1i" id="hole9A" value="" onChange= "updatesumi()"/>*

<input type="text" autocomplete="off" name="sum2i" readonly value="<?php echo $par9;?>" id="hole9B" onChange= "updatesumi()" />*

<input type="text" name="sumi" value="" id="hole9result" readonly style="" onChange= "updatesumtotal()" > <br>



<input type="text" name="Total Scores" * *id="Score" * * *class="clip" * value="" * * * readonly style="border:0px" */>

<input type="text" name="Par Total" * * * id="Par" * * * *class="clip" * value="Total" *readonly style="border:0px" />

<input type="text" name="sumtotal" *class="box" id="totalparscore" value="" * * * readonly style="" />



<input type="submit" name="submit"/>



</form>*

**

Is this a homework assignment? See: http://www.webdeveloper.com/forum/sh...=Dynamic+total

You also have several syntax errors . . . Check your error console.

What was wrong with the previous response in the link above?

Re the previous link...

I had to change the first function, as it was playing up.
Which then caused the second function you showed me not to work.

Where am I going wrong on the syntax?

As you can tell I'm really new to JavaScript, is white space not ignored in JavaScript?

Also some inputs are generated with php post, for some reason on change worked but on blur didn't when using php in the form

Ps. Thanks for your help!

It may be your PHP, because the following runs the JS without errors on FF. I know very little of PHP.
Tested on FF but not other browsers.

Remember to change the <form...> arguments for your needs.

Code:

<html> 

<head> 

<title>Text Summation</title>



<style type="text/css">

.parResult { border:0px solid black;width:50px;display:inline; }

</style>



<script type="text/javascript">

// From: http://www.webdeveloper.com/forum/showthread.php?270199-How-can-i-get-a-running-total-using-form-id-s&highlight=Dynamic+total

//  and: http://www.codingforums.com/showthread.php?p=1302472#post1302472



function calc(IDS) { 

  var one = Number(document.getElementById(IDS+'A').value);  if (isNaN(one)) { alert('Invalid entry: '+one); one=0; } 

  var two = Number(document.getElementById(IDS+'B').value);  if (isNaN(two)) { alert('Invalid entry: '+two); two=0; } 

  document.getElementById(IDS+'result').innerHTML = one - two;

  addition();

} 

function addition() {  

  var IDS;

  var total = 0;

  for (var i=1; i<=9; i++) { IDS = 'hole'+i+'result'; total += Number(document.getElementById(IDS).innerHTML); }

  document.getElementById("totalparscore").innerHTML = total;   

}  

</script>

</head>

<body> 



<!-- PHP not available for checking code and alter onsubmit when finished testing -->

<form name="form" method="post" action="" onsubmit="return false"> <!-- action="addup5.php" -->



1) Score:  <input name="h1" id="hole1A" value="" onblur="calc('hole1')" size="3" /> 

Par:       <input name="p1" id="hole1B" value="2" readonly size="3" /> 

Par Score: <div id="hole1result" class="parResult"></div><br>



2) Score:  <input name="h2" id="hole2A" value="" onblur="calc('hole2')" size="3" /> 

Par:       <input name="p2" id="hole2B" value="5" readonly size="3" /> 

Par Score: <div id="hole2result" class="parResult"></div><br>



3) Score:  <input name="h3" id="hole3A" value="" onblur="calc('hole3')" size="3" /> 

Par:       <input name="p3" id="hole3B" value="5" readonly size="3" /> 

Par Score: <div id="hole3result" class="parResult"></div><br>



4) Score:  <input name="h4" id="hole4A" value="" onblur="calc('hole4')" size="3" /> 

Par:       <input name="p4" id="hole4B" value="5" readonly size="3" /> 

Par Score: <div id="hole4result" class="parResult"></div><br>



5) Score:  <input name="h5" id="hole5A" value="" onblur="calc('hole5')" size="3" /> 

Par:       <input name="p5" id="hole5B" value="5" readonly size="3" /> 

Par Score: <div id="hole5result" class="parResult"></div><br>



6) Score:  <input name="h6" id="hole6A" value="" onblur="calc('hole6')" size="3" /> 

Par:       <input name="p6" id="hole6B" value="5" readonly size="3" /> 

Par Score: <div id="hole6result" class="parResult"></div><br>



7) Score:  <input name="h7" id="hole7A" value="" onblur="calc('hole7')" size="3" /> 

Par:       <input name="p7" id="hole7B" value="5" readonly size="3" /> 

Par Score: <div id="hole7result" class="parResult"></div><br>



8) Score:  <input name="h8" id="hole8A" value="" onblur="calc('hole8')" size="3" /> 

Par:       <input name="p8" id="hole8B" value="5" readonly size="3" /> 

Par Score: <div id="hole8result" class="parResult"></div><br>



9) Score:  <input name="h9" id="hole9A" value="" onblur="calc('hole9')" size="3" /> 

Par:       <input name="p9" id="hole9B" value="5" readonly size="3" /> 

Par Score: <div id="hole9result" class="parResult"></div><br>



Total par score: <div id="totalparscore" style="border:1px;width:30px;display:inline"></div> 

<br><input type="submit" name="submit" value="Submit Scores" />



</form>

</body> 

</html>