FIXED HEADER TO GRIDVIEW
IN ASPX:
<!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">
<style type="text/css">
<%-- This style to use Fixed header --%>
.GVFixedHeader { font-weight:bold; background-color:Gray; position:relative;
top:expression(this.parentNode.parentNode.parentNode.scrollTop-1);}
</style>
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Panel runat="server" ID="pnlContainer" ScrollBars="Auto" Height="150px" Width="400">
<asp:GridView ShowFooter="True" runat="server" Width="96%" ID="gvDemo" AutoGenerateColumns="False">
<HeaderStyle CssClass="GVFixedHeader" />
<Columns>
<asp:TemplateField HeaderText="C1">
<ItemTemplate>
<asp:Label ID="Label2" runat="server" Text='<%# Bind("Name") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="C2">
<ItemTemplate>
<asp:Label ID="Label1" runat="server" Text='<%# Bind("FriendName") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</asp:Panel>
</div>
</form>
</body>
</html>
IN ASPX.CS:
protected void Page_Load(object sender, EventArgs e)
{
DataTable dt = new DataTable();
dt.Columns.Add("Name", typeof(string));
dt.Columns.Add("FriendName", typeof(string));
for (int i = 1; i < 10; i++)
{
DataRow dr = dt.NewRow();
dr["Name"] = "Ravinder" + i;
dr["FriendName"] = "Ramesh" + i;
dt.Rows.Add(dr);
}
gvDemo.DataSource = dt;
gvDemo.DataBind();
}
OUTPUT:
when you scroll the grid header is not move
Comments
Post a Comment