Question

I’m having problem to sum each textbox value in a table cell. Here is the code I’ve written:

<asp:Table ID="table101" runat="server" CssClass="table100">
    <asp:TableRow>
        <asp:TableCell>Item 1 </asp:TableCell>
        <asp:TableCell>:</asp:TableCell>
        <asp:TableCell>
            <cus:cusTextBox ID="txtCDesc0" runat="server" Action="View"  ></cus:cusTextBox>
        </asp:TableCell>              
        <asp:TableCell>Cost: RM
            <cus:cusTextBox ID="txtCCost0" runat="server" Action="Edit" class="cost"  CssClass="inputTextM" OnKeyUp="return calculateTotalCost()"></cus:cusTextBox>                           
        </asp:TableCell>                   
    </asp:TableRow>

    <asp:TableRow>
        <asp:TableCell>Item 2</asp:TableCell>
        <asp:TableCell>:</asp:TableCell>
        <asp:TableCell>
            <cus:cusTextBox ID="txtCDesc1" runat="server" Action="View"  ></cus:cusTextBox>
        </asp:TableCell>              
        <asp:TableCell>Cost: RM
            <cus:cusTextBox ID="txtCCost1" runat="server" Action="Edit" class="cost"  CssClass="inputTextM" OnKeyUp="return calculateTotalCost()"></cus:cusTextBox>                           
        </asp:TableCell>                   
    </asp:TableRow>

    <asp:TableRow>
        <asp:TableCell>Item 3</asp:TableCell>
        <asp:TableCell>:</asp:TableCell>
        <asp:TableCell>
            <cus:cusTextBox ID="txtCDesc2" runat="server" Action="View"  ></cus:cusTextBox>
        </asp:TableCell>              
        <asp:TableCell>Cost: RM
            <cus:cusTextBox ID="txtCCost2" runat="server" Action="Edit" class="cost"  CssClass="inputTextM" OnKeyUp="return calculateTotalCost()"></cus:cusTextBox>                           
        </asp:TableCell>                   
    </asp:TableRow>

    <asp:TableRow>
        <asp:TableCell>Item 4 </asp:TableCell>
        <asp:TableCell>:</asp:TableCell>
        <asp:TableCell>
            <cus:cusTextBox ID="txtCDesc3" runat="server" Action="View"  ></cus:cusTextBox>
        </asp:TableCell>              
        <asp:TableCell>Cost: RM
            <cus:cusTextBox ID="txtCCost3" runat="server" Action="Edit" class="cost"  CssClass="inputTextM" OnKeyUp="return calculateTotalCost()"></cus:cusTextBox>                           
        </asp:TableCell>                   
    </asp:TableRow>

My jQuery code:

//--Calculate total cost--
function calculateTotalCost() {
    $('#<%=table101.ClientID %> tr').each(function () {
        var total;
        cost = parseFloat($(this).find("td").eq(3).find('input').val()).toFixed(2);
        total += cost;**//error**
        alert(total);
    });
}
//**Calculate total cost**

I am able to get each cell of textbox value, but not able to total each of the textbox values.

Answer 1

You need to initialize the total outside the loop. Try the following code..

//--Calculate total cost--
function calculateTotalCost() {
    var total, cost;
    total = 0;
    $('#<%=table101.ClientID %> tr').each(function () {        
        cost = parseFloat($(this).find("td").eq(3).find('input').val()).toFixed(2);
        total += cost;        
    });
    alert(total);
}
//**Calculate total cost**