I have a form where you select a player's name from a drop down list, and there are 6 input boxes next to it for their separate scores and a box at the end for their total score (all the separate scores summed).

I want to have the form dynamically calculate the total as you move between each field (or even just after the last field), and display it at the end of the row. The code for the first player is below:

Player 01 Name: 
<SELECT NAME=playerid1>
<OPTION VALUE=0>Select Player...
<?=$options?>
</SELECT>

<input type="text" name="p1h1" id="p1h1" size=1><input type="text" name="p1h2" id="p1h2" size=1><input type="text" name="p1h3" id="p1h3" size=1><input type="text" name="p1h4" id="p1h4" size=1><input type="text" name="p1h5" id="p1h5" size=1><input type="text" name="p1h6" id="p1h6" size=1> Total: <input type="text" name="score1" id="score1" size=2>

I've tried the few methods I have seen around the net, but none of the example coding works - in IE I get script errors, and in Firefox nothing happens at all.

It looks fairly simple to do if you have knowlege of JavaScript; just put the calculation method at the top, and call it via an onblur="total()" or similar in the form input thing.

Can anyone help? Thanks!

I have a form where you select a player's name from a drop down list, and there are 6 input boxes next to it for their separate scores and a box at the end for their total score (all the separate scores summed).

I want to have the form dynamically calculate the total as you move between each field (or even just after the last field), and display it at the end of the row. The code for the first player is below:

Player 01 Name: 
<SELECT NAME=playerid1>
<OPTION VALUE=0>Select Player...
<?=$options?>
</SELECT>

<input type="text" name="p1h1" id="p1h1" size=1><input type="text" name="p1h2" id="p1h2" size=1><input type="text" name="p1h3" id="p1h3" size=1><input type="text" name="p1h4" id="p1h4" size=1><input type="text" name="p1h5" id="p1h5" size=1><input type="text" name="p1h6" id="p1h6" size=1> Total: <input type="text" name="score1" id="score1" size=2>

I've tried the few methods I have seen around the net, but none of the example coding works - in IE I get script errors, and in Firefox nothing happens at all.

It looks fairly simple to do if you have knowlege of JavaScript; just put the calculation method at the top, and call it via an onblur="total()" or similar in the form input thing.

Can anyone help? Thanks!

Link me to the HTML (or attach it)

I've PM'd you the link to it. I will post the solution for others (if I find it) later, once I've stripped out my password and stuff from the code!

This article has been dead for over six months. Start a new discussion instead.