具有固定标题和滚动条的数据网格答案

【问题标题】：datagrid with fixed header and scrollbars具有固定标题和滚动条的数据网格
【发布时间】：2010-02-03 12:01:59
【问题描述】：

是否可以在数据网格中设置固定标题和滚动条？

我该怎么办？

谢谢

【问题讨论】：

标签： asp.net datagrid

【解决方案1】：

我在这方面工作了一段时间，并放弃了让 CSS 在所有浏览器上工作的想法。实现此目的的一种简单但不优雅的方法是只拥有两个列宽匹配的不同表。第一个表格保存标题，第二个表格保存内容并且是可滚动的。

我使用 jQuery 使所有列宽匹配。

完整的描述请看这篇帖子：Scrollable DataGrid table with Fixed Header with jQuery

【讨论】：

【解决方案2】：

在这个代码项目入口处有：Fixed Header in ASP.NET DataGrid

【讨论】：

表达式(this.offsetParent.scrollTop); Firefox 和 chrome 有问题
该 CodeProject 网站上给出的代码在 Firefox 中也对我不起作用。我还在寻找答案。

【解决方案3】：

为了解决这个问题，我在原始数据网格上方放置了第二个数据网格，我将两个数据网格中所有列的大小均等。在显示数据的数据网格中，我将标题设置为不显示。在后面的代码中，我将顶部数据网格绑定到一个空数据表，并将绑定字段设置为在为空时显示标题。

<div style="padding-bottom:2px">
<asp:GridView id="RoleListHeader" runat="server" AutoGenerateColumns="false" showheaderwhenempty="True" showheader="true" height="20px" width="350px" selectedrowstyle-height="20px" rowstyle-height="20px" headerstyle-height="10px" forecolor="#ff333333" backcolor="White">
	<columns>
		<asp:TemplateField ItemStyle-Width="23">
                    <ItemTemplate>
                    	<asp:CheckBox></asp:CheckBox>
					</ItemTemplate>
                </asp:TemplateField>
		<asp:BoundField DataField="SystemDesc" HeaderText="Role Description" ReadOnly="true" ItemStyle-Width="174"></asp:BoundField>
		<asp:BoundField DataField="EndDate" HeaderText="EndDate" ReadOnly="true" ItemStyle-Width="153"></asp:BoundField>
	</columns>
</asp:GridView>
</div>
<div style="max-height:300px;overflow:auto">
<asp:GridView id="RoleList" runat="server" AutoGenerateColumns="false" showheaderwhenempty="True" showheader="false" height="0px" width="350px" selectedrowstyle-height="20px" rowstyle-height="20px" headerstyle-height="10px" forecolor="#ff333333" backcolor="White" rowstyle-horizontalalign="Center" rowstyle-borderstyle="Solid" rowstyle-bordercolor="#ff404040">
	<columns>
		<asp:TemplateField ItemStyle-Width="23">
                    <ItemTemplate>
                    	<asp:CheckBox runat="server" OnCheckedChanged="GVChkBox_CheckChanged" AutoPostBack="true"></asp:CheckBox>
	</ItemTemplate>
                </asp:TemplateField>

		<asp:BoundField DataField="SystemDesc" HeaderText="Role Description" ReadOnly="true" ItemStyle-Width="174"></asp:BoundField>
		<asp:BoundField DataField="EndDate" HeaderText="EndDate" ReadOnly="true" ItemStyle-Width="153"></asp:BoundField>
		<asp:BoundField DataField="ADHSystemId" ShowHeader="false"></asp:BoundField>
	</columns>
</asp:GridView>
</div>

【讨论】：