Display sum of ASP.Net GridView each Columns and Row Total in Label using jQuery

Hey smile,

Please refer below smaple.

HTML

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript">
    $(function () {
        CalculateTotal();
        $("[id*=txtReci],[id*=txtArr],[id*=txtNet]").on('keyup', function () {
            CalculateTotal();
        });
    })
    function CalculateTotal() {
        var td = $("#gvBudget").find('tr').find('td');
        var txtReci = td.find("[id*=txtReci]");
        var txtArr = td.find("[id*=txtArr]");
        var txtNet = td.find("[id*=txtNet]");
        var reci = 0;
        var arr = 0;
        var net = 0;
        for (var i = 0; i < txtReci.length; i++) {
            reci += parseInt(txtReci.eq(i).val());
            arr += parseInt(txtArr.eq(i).val());
            net += parseInt(txtNet.eq(i).val());
        }
        $("[id*=gvBudget] [id*=lblRecievable]").html(reci);
        $("[id*=gvBudget] [id*=lblArrears]").html(arr);
        $("[id*=gvBudget] [id*=lblNet]").html(net);
        for (var i = 0; i < $("#gvBudget").find('tr').length; i++) {
            var reci1 = $("#gvBudget").find('tr').eq(i).find("[id*=txtReci]").val();
            var arr1 = $("#gvBudget").find('tr').eq(i).find("[id*=txtArr]").val();
            var net1 = $("#gvBudget").find('tr').eq(i).find("[id*=txtNet]").val();
            var total = parseInt(reci1) + parseInt(arr1) + parseInt(net1);
            $("#gvBudget").find('tr').eq(i).find('td').eq(8).html(total);
        }
    }
</script>
<div>
    <asp:GridView ID="gvBudget" runat="server" AutoGenerateColumns="False" ShowFooter="true">
        <Columns>
            <asp:TemplateField>
                <HeaderTemplate>
                    <asp:CheckBox ID="checkAll" runat="server" onclick="checkAll(this);" />
                </HeaderTemplate>
                <ItemTemplate>
                    <asp:CheckBox ID="CheckBox1" runat="server" onclick="Check_Click(this)" />
                </ItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField HeaderText="Reg No.">
                <ItemTemplate>
                    <asp:Label ID="lbl_No" runat="server" Text='<%# Eval("AdmissionNo") %>' Width="50"></asp:Label>
                </ItemTemplate>
            </asp:TemplateField>
            <asp:BoundField DataField="SName" HeaderText="Student Name"></asp:BoundField>
            <asp:BoundField DataField="FName" HeaderText="Father Name"></asp:BoundField>
            <asp:BoundField DataField="AcademicName" HeaderText="Session"></asp:BoundField>
            <asp:TemplateField HeaderText="Recievable">
                <ItemTemplate>
                    <asp:TextBox ID="txtReci" runat="server" Text='<%# Bind("Recievable") %>'>
                    </asp:TextBox>
                </ItemTemplate>
                <FooterTemplate>
                    <asp:Label ID="lblRecievable" runat="server" />
                </FooterTemplate>
            </asp:TemplateField>
            <asp:TemplateField HeaderText="Arrears">
                <ItemTemplate>
                    <asp:TextBox ID="txtArr" runat="server" Text='<%# Bind("RemBal") %>'>
                    </asp:TextBox>
                </ItemTemplate>
                <FooterTemplate>
                    <asp:Label ID="lblArrears" runat="server" />
                </FooterTemplate>
            </asp:TemplateField>
            <asp:TemplateField HeaderText="Net Balance">
                <ItemTemplate>
                    <asp:TextBox ID="txtNet" runat="server" Text='<%# Bind("Net") %>'>
                    </asp:TextBox>
                </ItemTemplate>
                <FooterTemplate>
                    <asp:Label ID="lblNet" runat="server" />
                </FooterTemplate>
            </asp:TemplateField>
            <asp:BoundField HeaderText="Total" />
        </Columns>
    </asp:GridView>
</div>

Namespaces

C#

using System.Data;

VB.Net

Imports System.Data

Code

C#

protected void Page_Load(object sender, EventArgs e)
{
    if (!this.IsPostBack)
    {
        DataTable dt = new DataTable();
        dt.Columns.AddRange(new DataColumn[] { 
        new DataColumn("AdmissionNo", typeof(string)),
        new DataColumn("SName", typeof(string)),
        new DataColumn("FName", typeof(string)),
        new DataColumn("AcademicName", typeof(string)),
        new DataColumn("Recievable", typeof(int)), 
        new DataColumn("RemBal", typeof(int)),
        new DataColumn("Net", typeof(int)) });
        dt.Rows.Add("r0001", "s1", "f1", "A1", 500, 100, 600);
        dt.Rows.Add("r0002", "s2", "f2", "A2", 500, 100, 600);
        dt.Rows.Add("r0003", "s3", "f3", "A3", 500, 500, 1000);
        gvBudget.DataSource = dt;
        gvBudget.DataBind();
    }
}

VB.Net

Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) Handles Me.Load
    If Not Me.IsPostBack Then
        Dim dt As DataTable = New DataTable()
        dt.Columns.AddRange(New DataColumn() {New DataColumn("AdmissionNo", GetType(String)), New DataColumn("SName", GetType(String)), New DataColumn("FName", GetType(String)), New DataColumn("AcademicName", GetType(String)), New DataColumn("Recievable", GetType(Integer)), New DataColumn("RemBal", GetType(Integer)), New DataColumn("Net", GetType(Integer))})
        dt.Rows.Add("r0001", "s1", "f1", "A1", 500, 100, 600)
        dt.Rows.Add("r0002", "s2", "f2", "A2", 500, 100, 600)
        dt.Rows.Add("r0003", "s3", "f3", "A3", 500, 500, 1000)
        gvBudget.DataSource = dt
        gvBudget.DataBind()
    End If
End Sub

Screenshot