GridView Custom Header

Suppose we want to display a custom Header to gridView Control. In that case, we can handle the GridView RowDataBound event to display Custom Header to GridView.

For example, A GridView control that displays a Custom Header to GridVIew.

Code: GridView09CustomHeader.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="GridView09CustomHeader.aspx.cs"
    Inherits="LearnAsp.Net.ControlDemo.GridView.GridView09CustomHeader" %>

<!DOCTYPE html
    PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>gridview header</title>
    <style type="text/css">
        .header
        {
            background-color: #3E3E3E;
            font-family: Calibri;
            color: White;
            text-align: center;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <h1>
            Employee Info</h1>
        <asp:GridView ID="grid" runat="server" AutoGenerateColumns="false" CellPadding="4" ShowHeader="false" ForeColor="#333333"
        OnRowCreated="grid_RowCreated" >
            <Columns>
                <asp:BoundField DataField="empno" HeaderText="Emp No" />
                <asp:BoundField DataField="ename" HeaderText="Name" />
                <asp:BoundField DataField="job" HeaderText="Job" />
                <asp:BoundField DataField="sal" HeaderText="Salary" />
                <asp:BoundField DataField="comm" HeaderText="Commission" />                
            </Columns>
            <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
            <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
            <EditRowStyle BackColor="#999999" />
            <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
            <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
            <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
            <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
        </asp:GridView>
        <br />
        <asp:Label ID="lblSelectRow" runat="server" />
    </div>
    </form>
</body>
</html>

Code: GridView09CustomHeader.aspx.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data.OracleClient;
using System.Data;
using System.Configuration;

namespace LearnAsp.Net.ControlDemo.GridView
{
    public partial class GridView09CustomHeader : System.Web.UI.Page
    {
        static string strConn = ConfigurationManager.ConnectionStrings["LearnAsp"].ToString();
        private OracleConnection objConn = new OracleConnection(strConn);
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack) { GridBind(); }
        }

        protected void GridBind()
        {
            String query = " select * from emp ";

            OracleCommand objCmd = new OracleCommand(query, objConn);
            DataTable dt = new DataTable();
            objConn.Open();
            OracleDataAdapter oda = new OracleDataAdapter(objCmd);
            oda.Fill(dt);
            objConn.Close();

            if (dt.Rows.Count > 0)
            {
                grid.DataSource = dt;
                grid.DataBind();
            }
            else
            {
                grid.DataSource = dt.NewRow();
                grid.DataBind();
                int columncount = grid.Rows[0].Cells.Count;
                grid.Rows[0].Cells.Clear();
                grid.Rows[0].Cells.Add(new TableCell());
                grid.Rows[0].Cells[0].ColumnSpan = columncount;
                grid.Rows[0].Cells[0].Text = "No Records Found";
            }
        }

        protected void grid_RowCreated(object sender, GridViewRowEventArgs e)
        {
            if (e.Row.RowType == DataControlRowType.Header)
            {
                GridViewRow HeaderRow = new GridViewRow(1, 0, DataControlRowType.Header, DataControlRowState.Insert);
                //ID	Name	Age
                TableCell HeaderCell2 = new TableCell();
                HeaderCell2.Text = "Emp No";
                HeaderCell2.ColumnSpan = 1;
                HeaderCell2.RowSpan = 2;
                HeaderRow.Cells.Add(HeaderCell2);

                HeaderCell2 = new TableCell();
                HeaderCell2.Text = "Name";
                HeaderCell2.ColumnSpan = 1;
                HeaderCell2.RowSpan = 2;
                HeaderRow.Cells.Add(HeaderCell2);

                HeaderCell2 = new TableCell();
                HeaderCell2.Text = "Job";
                HeaderCell2.ColumnSpan = 1;
                HeaderCell2.RowSpan = 2;
                HeaderRow.Cells.Add(HeaderCell2);

                HeaderCell2 = new TableCell();
                HeaderCell2.Text = "Total Salay";
                HeaderCell2.ColumnSpan = 2;
                HeaderCell2.HorizontalAlign = HorizontalAlign.Center;
                HeaderRow.Cells.Add(HeaderCell2);

                grid.Controls[0].Controls.AddAt(0, HeaderRow);

                GridViewRow HeaderRow2 = new GridViewRow(1, 0, DataControlRowType.Header, DataControlRowState.Insert);
                TableCell HeaderCell3 = new TableCell();
                HeaderCell3.Text = "Salay";
                HeaderRow2.Cells.Add(HeaderCell3);

                HeaderCell3 = new TableCell();
                HeaderCell3.Text = "Commission";
                HeaderRow2.Cells.Add(HeaderCell3);
                grid.Controls[0].Controls.AddAt(1, HeaderRow2);
            }
        }
    }
}

Output:

09 February 2020

GridView Custom Header

No comments:

Post a Comment