Calculate TextBox total using jQuery in ASP.Net

Last Reply 9 months ago By pandeyism

Posted 9 months ago

I want All table textbox total generated automatically in another (last) textbox of the table

 

Posted 9 months ago Modified on 9 months ago

Hi VinitaAkha,

Refer below code for total. you need to write code in jquery otherwise make textchange event for all textbox and calculate it.

HTML

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script type="text/javascript">
        $(function () {
            var value = 0
            $('input[type=text]').change(function () {
                value = parseInt(value) + parseInt($(this).val());
                $('#TextBox34').val(value);
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <div class="container" style="width: auto; font-size: 25px; background-color: gainsboro">
            <div class="form-part">
                <h2 style="background-color: darkcyan; width: auto; height: 100px; font-size: 40px;
                    text-align: center; padding-top: 30px; border: double; color: white">
                    <b>Add Monthly Cost</b></h2>
                <h4 style="font-size: 35px">
                    A)Fixed Capital:</h4>
                <table border="1" id="tbldynamic" runat="server">
                    <tr style="background-color: darksalmon">
                        <td>
                            <h1 style="font-size: 30px; text-align: center;">
                                (i)Land & Building:
                            </h1>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label3" runat="server" Text="1)Land" Width="900px" Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox3" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                    <br />
                    <tr>
                        <td>
                            <asp:Label ID="Label1" runat="server" Text="2)Built Up Area(Cost of construction)"
                                Width="900px" Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox1" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label2" runat="server" Text="Total Land:-" ForeColor="#ff0000" Font-Bold="true"
                                Width="900px" Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox2" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                </table>
                <br />
                <table border="1">
                    <tr style="background-color: darksalmon">
                        <td>
                            <h1 style="font-size: 30px; text-align: center">
                                (ii)Machinery & Equipment
                            </h1>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label4" runat="server" Text="1)Washing Tank" Width="900px" Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox4" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label5" runat="server" Text="2)Pilling Machine " Width="900px" Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox5" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label6" runat="server" Text="3)Slicing Machine" Width="900px" Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox6" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label7" runat="server" Text="4)Frying Machine" Width="900px" Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox7" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label8" runat="server" Text="5)flavoring Machine" Width="900px" Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox8" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label9" runat="server" Text="6)Pouch Printing Machine" Width="900px"
                                Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox9" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label10" runat="server" Text="7)Other Expenditures" Width="900px"
                                Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox10" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label11" runat="server" Text="Total Machinery & Equipment:- " Font-Bold="true"
                                ForeColor="#ff0000" Width="900px" Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox11" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                </table>
            </div>
            <div class="ui-corner-right">
                <h4 style="font-size: 35px">
                    B)Working Capital:</h4>
                <table border="1">
                    <tr style="background-color: darksalmon">
                        <td>
                            <h1 style="font-size: 30px; text-align: center">
                                i)Salary & Wages
                            </h1>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label12" runat="server" Text="1)Manager" Width="900px" Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox12" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label13" runat="server" Text="2)Sales Supervisor" Width="900px" Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox13" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label14" runat="server" Text="3)Computer Operator" Width="900px" Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox14" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label15" runat="server" Text="4)Skilled Workers" Width="900px" Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox15" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label16" runat="server" Text="5)Un-skilled Workers " Width="900px"
                                Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox16" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label17" runat="server" Text="Total Salary & Wages:- " Font-Bold="true"
                                ForeColor="#ff0000" Width="900px" Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox17" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                </table>
                <br />
                <table border="1" style="text-align: left">
                    <tr style="background-color: darksalmon">
                        <td>
                            <h1 style="font-size: 30px; text-align: center">
                                ii)Raw Material
                            </h1>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label18" runat="server" Text="1)Potatoes " Width="900px" Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox18" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label23" runat="server" Text="2)Bananas " Width="900px" Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox23" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label19" runat="server" Text="3)Refined Oil " Width="900px" Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox19" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label20" runat="server" Text="4)Flavars,Chemicals Spices etc " Width="900px"
                                Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox20" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label21" runat="server" Text="5)Packing Material " Width="900px" Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox21" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label22" runat="server" Text="Total Raw Material:- " Font-Bold="true"
                                ForeColor="#ff0000" Width="900px" Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox22" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                </table>
                <table border="1">
                    <tr style="background-color: darksalmon">
                        <td>
                            <h1 style="font-size: 30px; text-align: center">
                                iii)Utilities:
                            </h1>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label24" runat="server" Text="1)Water " Width="900px" Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox24" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label25" runat="server" Text="2)Fuel " Width="900px" Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox25" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label26" runat="server" Text="3)Electricity " Width="900px" Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox26" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label27" runat="server" Text="Total Utilities:- " Font-Bold="true"
                                ForeColor="#ff0000" Width="900px" Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox27" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                </table>
                <br />
                <table border="1">
                    <tr style="background-color: darksalmon">
                        <td>
                            <h1 style="font-size: 30px; text-align: center">
                                iv) Other Contingent Expenses:
                            </h1>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label28" runat="server" Text=" 1)Consumable Stores  " Width="900px"
                                Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox28" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label29" runat="server" Text="2) Maintenance and Repairs   " Width="900px"
                                Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox29" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label30" runat="server" Text="3)Transportation & Travelling   " Width="900px"
                                Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox30" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label31" runat="server" Text="4)Insurance " Width="900px" Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox31" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label32" runat="server" Text=" 5) Other Expenses " Width="900px" Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox32" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label33" runat="server" Text=" 6)Advertisement & Publicity " Width="900px"
                                Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox33" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="Label34" runat="server" Text="Total Of Other Contingent Expenses :- "
                                Font-Bold="true" ForeColor="#ff0000" Width="900px" Font-Size="25px"></asp:Label>
                            <asp:TextBox ID="TextBox34" runat="server" Width="200px" Height="50px"></asp:TextBox>
                        </td>
                    </tr>
                </table>
            </div>
            <center>
                <asp:Button ID="Button1" runat="server" Text="Add Cost" CssClass="ui-button" BackColor="#ff0066"
                    ForeColor="#ffffff" Font-Size="35px" />
            </center>
        </div>
    </div>
    </form>
</body>
</html>