How to get GridView Running Column Sub Total in ASP.NET

Rakesh

GridViewColumn Sub TotalUI Code SideUI Design Side

28 Comments

Join the conversation! Your thoughts help the community grow.

Sr Karthiga10y ago
good one
Sr Karthiga10y ago
nice explanation
Rakesh11y ago
Thank you Santhakumar Munuswamy Sir
Santhakumar Munuswamy11y ago
Good Article. Thanks for sharing
Gopi Chand11y ago
Good going Mr Rakesh
- Rakesh11y ago
  thank you Gopi Chand
Rakesh11y ago
Thank you Shridhar Sharma
Shridhar Sharma11y ago
good one Rakesh
Vipul Malhotra11y ago
nice article sir
- Rakesh11y ago
  thank you Vipul Malhotra
Mohammed Ibrahim11y ago
good one
- Rakesh11y ago
  thanks Mohammed Ibrahim
Upendra Pratap Shahi11y ago
nice one sir
- Rakesh11y ago
  thank you Upendra Pratap Shahi
Sibeesh Venu11y ago
Nice Share...
- Rakesh11y ago
  thanks Sibeesh Venu
Ankit Bansal11y ago
good share...
- Rakesh11y ago
  thanks Ankit Bansal
Gowtham K11y ago
Nice one
- Rakesh11y ago
  thank you
Rajeesh Menoth11y ago
Good One
- Rakesh11y ago
  thank you Rajeesh Menoth
Sumit Joshi11y ago
Thanks for sharing.
- Rakesh11y ago
  thanks Sumit Joshi
Karthikeyan K11y ago
Good one sir...Thanks for share
- Rakesh11y ago
  thank you Karthikeyan K
Vaikesh K P11y ago
Good share
- Rakesh11y ago
  thank you Vaikesh K P

This article shows how to get a GridView's current page row column total of a sum and the GridView's all rows column grand total of the sum.

Step 1: Database

First create a table in a database as in the following.

Table: Item

create table Item
(
Itemid int identity(1, 1) primary key,
ItemName varchar(100),
ItemPrice decimal(7, 2)
)

Now fill in some records in a database as in the following:

Figure 1: Table Record

Step 2: Visual Studio

Add a new project.
Go to the project in Solution Explorer.
Right-click and Add Item.
Select Web Form as in the following.

Figure 2: Add Form

Step 3: UI Design

In this Design section add a GridView control to display the database table data on a web page.

UI Design

<%@ Page Title="" Language="C#" MasterPageFile="~/Master/Master.master" AutoEventWireup="true" CodeFile="Gridviewsum.aspx.cs" Inherits="UI_Gridviewsum" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<h2 style="color: #00CC00">Gridview Column Total and Sub Total</h2>
<div>
<asp:GridView ID="GridItem" runat="server" Width="100%"
AutoGenerateColumns="False"
RowStyle-HorizontalAlign="Center"
ShowFooter="True" AllowPaging="True" PageSize="5" OnPageIndexChanging="GridItem_PageIndexChanging" OnRowDataBound="GridItem_RowDataBound"
BackColor ="White" BorderColor="#CC9966" BorderWidth="1px" CellPadding="4" >
<Columns>
<asp:TemplateField HeaderText="Item No">
<ItemTemplate><%#Eval("Itemid")%></ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Item Name">
<ItemTemplate><%#Eval("ItemName")%></ItemTemplate>
<FooterTemplate>
<div style="padding:0 0 5px 0"><asp:Label Text="Page Total" runat="server" /></div>
<div><asp:Label Text="Grand Total" runat="server" /></div>
</FooterTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Price ">
<ItemTemplate><asp:Label ID="lblPrice" runat="server" Text='<%#Eval("ItemPrice")%>'>
</asp:Label></ItemTemplate>
<FooterTemplate>
<div style="padding:0 0 5px 0"><asp:Label ID="lblTotal" runat="server" /></div>
<div><asp:Label ID="lblTotalPrice" runat="server" /></div>
</FooterTemplate>
</asp:TemplateField>
</Columns>
<FooterStyle BackColor="#FFFFCC" ForeColor="#330099" />
<HeaderStyle BackColor="#990000" Font-Bold="True" ForeColor="#FFFFCC" />
<PagerStyle BackColor="#FFFFCC" ForeColor="#330099" HorizontalAlign="Center" />
<RowStyle BackColor="White" ForeColor="#330099" />
<SelectedRowStyle BackColor="#FFCC66" Font-Bold="True" ForeColor="#663399" />
<SortedAscendingCellStyle BackColor="#FEFCEB" />
<SortedAscendingHeaderStyle BackColor="#AF0101" />
<SortedDescendingCellStyle BackColor="#F6F0C0" />
<SortedDescendingHeaderStyle BackColor="#7E0000" />
</asp:GridView>
</div>
</asp:Content>

Step 4: UI Code

In this code section we will write the GridView bind code and add a GridView page index changing command and row data bound command as in the following from the GridView properties.

Figure 3: Add Command

Also add a viewstate for the store item price.

UI CODE

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Configuration;
using System.Data;
using System.Data.SqlClient;
public partial class UI_Gridviewsum: System.Web.UI.Page {
string connection = ConfigurationManager.ConnectionStrings["connstring"].ConnectionString;
protected void Page_Load(object sender, EventArgs e) {
if (!IsPostBack) {
BindItemList();
}
}
private void BindItemList() {
string Query = "SELECT * FROM Item";
using(SqlConnection con = new SqlConnection(connection)) {
using(SqlCommand cmd = con.CreateCommand()) {
cmd.CommandText = Query;
con.Open();
DataTable dt = new DataTable();
SqlDataAdapter da = new SqlDataAdapter();
da.SelectCommand = cmd;
da.Fill(dt);
if (ViewState["TotalPrice"] == null) {
Decimal Price = 0;
for (int i = 0; i <= dt.Rows.Count - 1; i++) {
Price += dt.Rows[i].Field < Decimal > (2);
}
ViewState["TotalPrice"] = Price;
}
GridItem.DataSource = dt;
GridItem.DataBind();
}
}
}
protected void GridItem_PageIndexChanging(object sender, GridViewPageEventArgs e) {
GridItem.PageIndex = e.NewPageIndex;
BindItemList();
}
Decimal Page_Sum;
protected void GridItem_RowDataBound(object sender, GridViewRowEventArgs e) {
if (e.Row.RowType == DataControlRowType.DataRow) {
Label lblPageTotal = (Label) e.Row.FindControl("lblPrice");
Page_Sum += Decimal.Parse(lblPageTotal.Text);
}
if (e.Row.RowType == DataControlRowType.Footer) {
if (ViewState["TotalPrice"] != null && Page_Sum != 0) {
Label lblTotal = (Label) e.Row.FindControl("lblTotal");
lblTotal.Text = Page_Sum.ToString();
Label lblTotalPrice = (Label) e.Row.FindControl("lblTotalPrice");
lblTotalPrice.Text = ViewState["TotalPrice"].ToString();
}
}
}
}

Step 5: Browser

Now your page is ready to run in a browser, press F5.

Figure 4: Grid Page 1 Sub Total and Grand Total

Figure 5: Grid Page 2 Sub Total and Grand Total

I hope you understand how to get a running item price subtotal and total using an ASP.Net GridView control.