Jquery calculation plugin รวมค่าใน filed

[mindphp]

The Calculation plug-in is designed to give easy-to-use jQuery functions for commonly used mathematical functions.

This plug-in will work on all types of HTML elements—which means you can use it to calculate values in <td> elements or in <input> elements. You can even mix and match between element types.

http://www.pengoworks.com/workshop/jque ... plugin.htm

ตัวอย่างการใช้

โค้ด: เลือกทั้งหมด

	<script type="text/javascript">
	$(document).ready(
		function (){
			$("input[name^=b_]").sum("keyup", "#b_Total");
			$("input[name^=t_]").sum("keyup", "#t_Total");		
		}
	);
	
	</script>

้html

โค้ด: เลือกทั้งหมด

   <table> <tr>
          <td align="right">Budget</td>

                    <td width="48">
            <input name="b_1" id="b_1" style="width: 36px;" type="text">          </td>
		          <td width="48">
            <input name="b_2" id="b_2" style="width: 36px;" type="text">          </td>
		          <td width="48">
            <input name="b_3" id="b_3" style="width: 36px;" type="text">          </td>
		          <td width="48">

            <input name="b_4" id="b_4" style="width: 36px;" type="text">          </td>
		          <td width="48">
            <input name="b_5" id="b_5" style="width: 36px;" type="text">          </td>
		          <td width="48">
            <input name="b_6" id="b_6" style="width: 36px;" type="text">          </td>
		          <td width="48">
            <input name="b_7" id="b_7" style="width: 36px;" type="text">          </td>

		          <td width="48">
            <input name="b_8" id="b_8" style="width: 36px;" type="text">          </td>
		          <td width="48">
            <input name="b_9" id="b_9" style="width: 36px;" type="text">          </td>
		          <td width="48">
            <input name="b_10" id="b_10" style="width: 36px;" type="text">          </td>
		          <td width="48">

            <input name="b_11" id="b_11" style="width: 36px;" type="text">          </td>
		          <td width="48">
            <input name="b_12" id="b_12" style="width: 36px;" type="text">          </td>
		          <td id="b_Total" align="left">0</td>
        </tr>
        <tr>
          <td align="right">Taget</td>

                    <td>
            <input name="t_1" id="t_1" style="width: 36px;" type="text">          </td>
		          <td>
            <input name="t_2" id="t_2" style="width: 36px;" type="text">          </td>
		          <td>
            <input name="t_3" id="t_3" style="width: 36px;" type="text">          </td>
		          <td>

            <input name="t_4" id="t_4" style="width: 36px;" type="text">          </td>
		          <td>
            <input name="t_5" id="t_5" style="width: 36px;" type="text">          </td>
		          <td>
            <input name="t_6" id="t_6" style="width: 36px;" type="text">          </td>
		          <td>
            <input name="t_7" id="t_7" style="width: 36px;" type="text">          </td>

		          <td>
            <input name="t_8" id="t_8" style="width: 36px;" type="text">          </td>
		          <td>
            <input name="t_9" id="t_9" style="width: 36px;" type="text">          </td>
		          <td>
            <input name="t_10" id="t_10" style="width: 36px;" type="text">          </td>
		          <td>

            <input name="t_11" id="t_11" style="width: 36px;" type="text">          </td>
		          <td>
            <input name="t_12" id="t_12" style="width: 36px;" type="text">          </td>
		          <td id="t_Total" align="left">0</td>
        </tr>
</table>