|
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="FixedHeaderDatagrid.aspx.cs" Inherits="Default2" %>
<!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>Scrolling Header for Datagrid</title>
<script type="text/javascript" language="javascript">
function setonScroll(divObj,DgID) // call this in onscroll event in div
{
var datagrid = document.getElementById(DgID);
var HeaderCells = datagrid.getElementsByTagName('th');
var HeaderRow;
if(HeaderCells == null || HeaderCells.length == 0) // check wether any tableheader cells present in given datagrid
{
var AllRows = datagrid.getElementsByTagName('tr');
HeaderRow = AllRows[0];
}
else
{
HeaderRow = HeaderCells[0].parentNode;
}
var DivsTopPosition = parseInt(divObj.scrollTop);
if(DivsTopPosition>0)
{
HeaderRow.style.position = 'absolute';
HeaderRow.style.top = (parseInt(DivsTopPosition)).toString() + 'px';
HeaderRow.style.width = datagrid.style.width;
HeaderRow.style.zIndex='1000';
}
else
{
divObj.scrollTop = 0;
HeaderRow.style.position = 'relative';
HeaderRow.style.top = '0';
HeaderRow.style.bottom='0';
HeaderRow.style.zIndex='0';
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div id="Div" runat="server" style="position:relative; top:0px; left:0px; height:500px; width:250px; overflow:auto">
<asp:DataGrid ID="dgCheckScrollingHeader" runat="server" Width="410px" AutoGenerateColumns="False" CellSpacing="1" CellPadding="0" ForeColor="#333333" GridLines="vertical">
<Columns>
<asp:TemplateColumn HeaderText="Column 1">
<ItemTemplate>
<asp:Label ID="lblCol1Data" Width="130px" runat="server" Text='<%# DataBinder.Eval(Container.DataItem,"Col1Data") %>' ></asp:Label>
</ItemTemplate>
<HeaderStyle Width="150px" />
<ItemStyle Width="150px" />
</asp:TemplateColumn>
<asp:TemplateColumn HeaderText="Column 2">
<ItemTemplate>
<asp:Label ID="lblCol2Data" Width="170px" runat="server" Text='<%# DataBinder.Eval(Container.DataItem,"Col2Data") %>' ></asp:Label>
</ItemTemplate>
<HeaderStyle Width="180px" />
<ItemStyle Width="180px" />
</asp:TemplateColumn>
<asp:TemplateColumn HeaderText="Column 3">
<ItemTemplate>
<asp:Label ID="lblCol3Data" Width="70px" runat="server" Text='<%# DataBinder.Eval(Container.DataItem,"Col3Data") %>' ></asp:Label>
</ItemTemplate>
<HeaderStyle Width="80px" />
<ItemStyle Width="80px" />
</asp:TemplateColumn>
</Columns>
<AlternatingItemStyle BackColor="White" />
<ItemStyle BackColor="#EFF3FB" />
<HeaderStyle BackColor="#507CD1" Font-Bold="True" Height="25px" Font-Size="15px" ForeColor="White" HorizontalAlign="Center" Wrap="false" />
</asp:DataGrid>
</div>
</form>
</body>
</html>
|
By viewing downloads associated with this article you agree to the Terms of Service and the article's licence.
If a file you wish to view isn't highlighted, and is a text file (not binary), please
let us know and we'll add colourisation support for it.
This member has not yet provided a Biography. Assume it's interesting and varied, and probably something to do with programming.
This member has not yet provided a Biography. Assume it's interesting and varied, and probably something to do with programming.