Sorting table rows accdg to a column value

[hAnDoFhOnOr]

Hi, first of my english is not very good so i will try to make it as clear as possible. ThanksI was wondering if you have any suggestions with my problem. I want my table to be sorted according to a specific column. But my problem is the values are from a javascript function (w/c also makes me wonder if i should have posted this in the javascript forum below instead). anyway here is what the table looks like

<table border="0" cellpadding="0" cellspacing="3"><tr>             <td width="15" bgcolor="#0000ff"> </td>              <td width="100"><input type="text" name="label_acu" value="Aircon"   class="formtext11" onfocus="this.blur();"></td>               <td width="15" class="formtext9">|</td>               <td><input type="text" name="amt_acu" value="PhP 0" class="formtext10" onfocus="this.blur();"></td>               <td width="15" class="formtext9">|</td>               <td><input type="text" name="percent_acu" value="0%" class="formtext9"  onfocus="this.blur();"></td></tr><tr>	<td bgcolor="#9ACD32"> </td>	<td><input type="text" name="label_ref" value="Refrigerator" class="formtext11" onfocus="this.blur();"></td>	<td class="formtext9">|</td>					<td><input type="text" name="amt_ref" value="PhP 0" class="formtext10" onfocus="this.blur();"></td>	<td class="formtext9">|</td>	<td><input type="text" name="percent_ref" value="0%" class="formtext9" onfocus="this.blur();"></td></tr><tr>	<td bgcolor="#ff0000"> </td>	<td><input type="text" name="label_cok" value="Cooking" class="formtext11" onfocus="this.blur();"></td>	<td class="formtext9">|</td>	<td><input type="text" name="amt_cok" value="PhP 0" class="formtext10" onfocus="this.blur();"></td>	<td class="formtext9">|</td>				<td><input type="text" name="percent_cok" value="0%" class="formtext9" onfocus="this.blur();"></td></tr><tr>	<td bgcolor="#ffff00" > </td>	<td><input type="text" name="label_fan" value="Fan" class="formtext11" onfocus="this.blur();"></td>	<td class="formtext9">|</td>	<td><input type="text" name="amt_fan" value="PhP 0" class="formtext10" onfocus="this.blur();"></td>	<td class="formtext9">|</td>					<td><input type="text" name="percent_fan" value="0%" class="formtext9" onfocus="this.blur();"></td></tr><tr>	<td bgcolor="#d2691e"> </td>	<td><input type="text" name="label_ent" value="Entertainment" class="formtext11" onfocus="this.blur();"></td>	<td class="formtext9">|</td>	<td><input type="text" name="amt_ent" value="PhP 0" class="formtext10" onfocus="this.blur();"></td>	<td class="formtext9">|</td>	<td><input type="text" name="percent_ent" value="0%" class="formtext9" onfocus="this.blur();"></td></tr><tr>	<td bgcolor="#ee82ee"> </td>	<td><input type="text" name="label_gap" value="Gen. Appliances" class="formtext11" onfocus="this.blur();"></td>	<td class="formtext9">|</td>	<td><input type="text" name="amt_gap" value="PhP 0" class="formtext10" onfocus="this.blur();"></td>	<td class="formtext9">|</td>					<td><input type="text" name="percent_gap" value="0%" class="formtext9" onfocus="this.blur();"></td></tr></table>

currently they are in a fixed position, the values on the amt and percent column changes each time a new appliance is added to the list. i was wondering if anyone would have any suggestion?values are assigned like document.energy_form.amt_aircon.value = aircon_value to each appliance everytime.I would like for them to change in order e.g. the appliance with the biggest amount will be in the first row, followed by the second biggest and so on. I know i won't be able to do it with html alone, and i was trying to figure out if i could possibly use layers. Any suggestions?thanks again in advance.

[aspnetguy]

http://www.kryogenix.org/code/browser/sorttable/This should help

[hAnDoFhOnOr]

thanks for that aspnetguy, i have tried that approach, i'm wondering if their is a way were the user wouldn't need to click the row headers. i mean, the rows will automatically update themselves once a new value is added to the list. again thanks in advance.