Stats inc/decrement table

Hi
I need a table like below
[URL=”http://img25.imageshack.us/img25/9568/screenshotkoc.jpg”]http://img25.imageshack.us/img25/9568/screenshotkoc.jpg[/URL]

I am new to javascript and have several ideas after going on the w3c website but can’t seem to glue the ideas together. Any help appreciated.

I have a pool of stats point (say 20) that can be assigned to various attributes which have starting values (say 8) . I want a text box for the starting value and images for plus or minus to decrement or increment the stats whilst modifying the pool of overall stats points.

So far my ideas are to use onmouseclick and
I have written
if $a ($tb ++ && $p — while $p>0);
if $b ($tb — && $p ++ while $p<20);

I have the idea to define the plus image as $a, minus image $b the pool of stats $p and the text box with starting value (which I have to find out how to set) as $tb.

I have no clue if this will work or if I’ve got muddled with php and am struggling to glue it together with the form inputs and onmouseclick.

My form is as follows (class=”tb” is from the css file and applies style to the textboxes):

[CODE]<div id=”stats” >

<font color=”#6B50C1″ face=”achafont” size=”2″>
<table class=”statstable” border=”0″ cellpadding=”10″>
<tr ><td>Deftness</td><td><img src=”images/minus.jpg” alt=”minus”
/><input type=”textbox” name=”deftness” size=”1″ class=”tb”/><img src=”images/plus.jpg” alt=”plus” /></td></tr>
<tr ><td>Charm</td><td><img src=”images/minus.jpg” alt=”minus” /><input type=”textbox” size=”1″ name=”charm” class=”tb” /><img src=”images/plus.jpg” alt=”plus” /></td></tr>
<tr ><td>Wit</td><td><img src=”images/minus.jpg” alt=”minus” /><input type=”textbox” name=”wit” size=”1″ class=”tb” /><img src=”images/plus.jpg” alt=”plus” /></td></tr>
<tr ><td>Magika</td><td><img src=”images/minus.jpg” alt=”minus” /><input type=”textbox” size=”1″ name=”magika” class=”tb” /><img src=”images/plus.jpg” alt=”plus” /></td></tr>
<tr ><td>Clarity</td><td><img src=”images/minus.jpg” alt=”minus” /><input type=”textbox” name=”clarity” size=”1″ class=”tb” /><img src=”images/plus.jpg” alt=”plus” /></td></tr>
<tr ><td>Ruthlessness &nbsp;</td><td><img src=”images/minus.jpg” alt=”minus” /><input type=”textbox” size=”1″ name=”ruthlessness” class=”tb” /><img src=”images/plus.jpg” alt=”plus” /></td></tr>
<tr ><td>Stealthiness </td><td><img src=”images/minus.jpg” alt=”minus” /><input type=”textbox” size=”1″ name=”stealthiness” class=”tb” /><img src=”images/plus.jpg” alt=”plus” /></td></tr>
<tr><td colspan=”2″>Points to spend=xx</td></tr>
</table><br /><br />
</font>

</div>
[/CODE]

Also in #JavaScript _↴