ASP.NET – Display Total in GridView using FooterTemplate

Updated on September 22, 2015     Kisan Patel

This tutorial will explain you how to display total in GridView using FooterTemplate in ASP.NET C#?

Here, we have used below “Products” table to bind ASP.NET GridView control.

Next, add the below line of code inside Default.aspx page.

<form id="form1" runat="server">
  <div>
     <asp:GridView ID="GridView_Products" runat="server" ShowFooter="true" AutoGenerateColumns="False" DataKeyNames="Id" OnRowDataBound="GridView_Products_RowDataBound">
       <Columns>
          <asp:TemplateField HeaderText="Id" InsertVisible="False">
             <ItemTemplate>
                 <asp:Label ID="lbl_Id" runat="server" Text='<%# Bind("Id") %>'></asp:Label>
             </ItemTemplate>
          </asp:TemplateField>
          <asp:TemplateField HeaderText="ProductName">
             <ItemTemplate>
                 <asp:Label ID="lbl_ProductName" runat="server" Text='<%# Bind("ProductName") %>'></asp:Label>
             </ItemTemplate>
          </asp:TemplateField>
          <asp:TemplateField HeaderText="Quantity">
             <ItemTemplate>
                 <asp:Label ID="lbl_Quantity" runat="server" Text='<%# Bind("Quantity") %>'></asp:Label>
             </ItemTemplate>
             <FooterTemplate>
                 <asp:Label ID="lbl_Quantity_Total" runat="server" ></asp:Label>
             </FooterTemplate>
          </asp:TemplateField>
          <asp:TemplateField HeaderText="Price">
             <ItemTemplate>
                 <asp:Label ID="lbl_Price" runat="server" Text='<%# Bind("Price") %>'></asp:Label>
             </ItemTemplate>
          </asp:TemplateField>
      </Columns>
    </asp:GridView>
  </div>
</form>

You can see in above code, we have added simple GridView control and also we have added FooterTemplate inside Quantity Column TemplateField.

<asp:TemplateField HeaderText="Quantity">
    <ItemTemplate>
       <asp:Label ID="lbl_Quantity" runat="server" Text='<%# Bind("Quantity") %>'></asp:Label>
    </ItemTemplate>
    <FooterTemplate>
       <asp:Label ID="lbl_Quantity_Total" runat="server" ></asp:Label>
    </FooterTemplate>
</asp:TemplateField>

Now, add below line of code inside Default.aspx.cs page. In below code, first we have declared quantityTotal variable then we have generate GridView_Products_RowDataBound event and inside RowDataBound event, we have calculate total of quantity.

using System;
using System.Configuration;
using System.Data;
using System.Data.SqlClient;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace GridViewDemo
{
    public partial class GridViewTotalDemo : System.Web.UI.Page
    {
        int quantityTotal = 0;
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!Page.IsPostBack)
            {

                SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["connectionString"].ConnectionString);
                con.Open();
                SqlCommand cmd = new SqlCommand("Select * from Products", con);
                SqlDataAdapter sda = new SqlDataAdapter(cmd);
                DataTable dt = new DataTable();
                sda.Fill(dt);
                con.Close();

                // specify the source for the GridView
                GridView_Products.DataSource = dt;

                //Bind the GridView
                GridView_Products.DataBind();

            }
        }

        protected void GridView_Products_RowDataBound(object sender, GridViewRowEventArgs e)
        {
            if (e.Row.RowType == DataControlRowType.DataRow)
            {
                quantityTotal += Convert.ToInt32(DataBinder.Eval(e.Row.DataItem, "Quantity"));
            }
            else if (e.Row.RowType == DataControlRowType.Footer)
            {
                Label lblQtyTotal = (Label)e.Row.FindControl("lbl_Quantity_Total");
                lblQtyTotal.Text =  "Total: "+ quantityTotal.ToString();
            }
        }
    }
}

Demo

Download Complete Source Code