Requirement :
GridView with Multiple Header rows.
When vertical scroll, headers freeezed (GridView rows only scrollable).
Is it possible? here is my code..
Aspx:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ScrollableGridWithFixedHeader.aspx.cs" Inherits="ScrollableDataGrid.ScrollableGridWithFixedHeader" %>
<!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">
<script src="css/jquery-1.4.1.min.js" type="text/javascript"></script>
<script src="css/ScrollableGridPlugin.js" type="text/javascript"></script>
<title>Scrollable Grid with Fixed Header</title>
<style type="text/css">
.GVFixedHeader
{
font-weight:bold;
background-color:Green;
position:relative;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<asp:Button ID="btnGetData" Text="Get Data" runat="server" OnClick="OnGetDataClick"/>
<%-- <asp:panel ID="panelContainer" runat="server"
ScrollBars="vertical"
Width="100%" Height="400px">--%>
<asp:GridView ID="EmployeeGrid" runat="server" AutoGenerateColumns="true" DataKeyNames="Customer"
OnRowCreated="EmployeeGrid_RowCreated"
Font-Names="Times New Roman" BorderColor="Black" BorderStyle="Solid"
BorderWidth="1">
<rowstyle backcolor="#EFF3FB">
<footerstyle backcolor="#507CD1" font-bold="True" forecolor="White">
<pagerstyle backcolor="#2461BF" forecolor="White" horizontalalign="Center">
<HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
<alternatingrowstyle backcolor="White">
<%-- --%>
</form>
</body>
</html>
cs Code is here:
------------------------------------------------------
using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;
using System.Data.SqlClient;
namespace ScrollableDataGrid
{
public partial class ScrollableGridWithFixedHeader : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void EmployeeGrid_RowCreated(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.Header)
{
//Creating a gridview object
GridView objGridView = (GridView)EmployeeGrid;
//Creating a gridview row object
GridViewRow HeaderGridRow = new GridViewRow(1, 0, DataControlRowType.Header, DataControlRowState.Insert);
//Creating a table cell object
TableCell HeaderCell = new TableCell();
HeaderCell = new TableCell();
HeaderCell.Text = "ODE Endtime";
HeaderCell.ColumnSpan = 3;
HeaderGridRow.Cells.Add(HeaderCell);
HeaderCell = new TableCell();
HeaderCell.Text = "RDE Endtime";
HeaderCell.ColumnSpan = 8;
HeaderGridRow.Cells.Add(HeaderCell);
//Add a blank cell at the first three cell headers
//This can be achieved by making the colspan property of the table cell object as 3
// and the text property of the table cell object will be blank
//Henceforth, add the table cell object to the grid view row object
//AddMergedCells(objgridviewrow, objtablecell, 3, "Employee Detail", System.Drawing.Color.LightGreen.Name);
//Merge columns d,e (i.e.Address, City, Region, Postal Code, Country) under the column name "Address Details"
//This can be achieved by making the colspan property of the table cell object as 2
//and setting it's text to "Address Details"
//Henceforth, add the table cell object to the grid view row object
//AddMergedCells(objgridviewrow, objtablecell, 2, "Address Details", System.Drawing.Color.LightSkyBlue.Name);
//AddMergedCells(objgridviewrow, objtablecell,4, "Address Specify", System.Drawing.Color.LightSkyBlue.Name);
//Lastly add the gridrow object to the gridview object at the 0th position
//Because,the header row position is 0.
//EmployeeGrid.Controls[0].Controls.AddAt(0, objGridView);
EmployeeGrid.Controls[0].Controls.AddAt(0, HeaderGridRow);
}
}
protected void OnGetDataClick(object sender, EventArgs e)
{
string ConnString = ConfigurationManager.ConnectionStrings["ConnStrForEVTS"].ConnectionString;
string SqlString = "select top 200 * from dbo.Daily_Abend_RDE_Rpt";
using (SqlConnection conn = new SqlConnection(ConnString))
{
using (SqlCommand cmd = new SqlCommand(SqlString, conn))
{
cmd.CommandType = CommandType.Text;
//cmd.Parameters.AddWithValue("FirstName", txtFirstName.Text);
conn.Open();
using (SqlDataReader reader = cmd.ExecuteReader())
{
EmployeeGrid.DataSource = reader;
EmployeeGrid.DataBind();
}
}
}
}
}
}
Please just let me now if the simple solution is exists or not? while we will do we have take care about the alignment of each record of respective column also.
Thanks in advanced :)
Anup
Submit an article or tip