首先看看 CodeProject 上的两个东西
1、The Freeze Pane DataGrid (http://www.codeproject.com/aspnet/FreezePaneDatagrid.asp)
利用文章中提到做法及代码,可以实现在 ASP.NET 1.1 上的、支持横向滚动与纵向滚动的表格,基本上是使用 CSS 实现的,比较简单。
在 ASP.NET 2.0 上,由于文档 HTML DOCKTYPE 发生了变化(HTML->XHTML),所以在使用原文中的横向滚动条会出现问题,但是使用纵向滚动条和锁定表头没有问题。
这种做法没有考虑页面 PostBack 时记录表格的滚动位置,使得用户不得不重新去寻找刚才选中/编辑的那条记录,这比较的不人性化。
2、ScrollingGrid: A cross-browser freeze-header two-way scrolling DataGrid(http://www.codeproject.com/aspnet/ScrollingGrid.asp)
此文章利用 Panel 控件和 DataGrid 控件实现了 ASP.NET 1.1 下的完整的、可实现双向滚动、表头锁定的表格,而且它实现了可以记录表格的滚动位置,页面 PostBack 后,表格仍能自动滚动到原有位置。这个控件的一个最大优点是能够适应多种浏览器,如 Internet Explorer 、FireFox 等。
在 ASP.NET 平台上,由于 DataGrid 控件已经升级为 GridView ,所以此控件已不能使用,按照文章下面的讨论,作者声称会尽快升级控件,但似乎在实现时碰到一些麻烦(如何确实表头各列的宽度),目前还没有结果。
目前我的做法:
- 参照文章1中提到的作法,利用 CSS 来实现锁定表头的功能
- 利用 Panel 控件,设置 ScrollBar 为 Vertical,再在其中放入 GridView 控件 ,可以实现竖向滚动条的功能
- 利用 Atlas ,将上述 Panel 再放入 UpdatePanel ,以透明实现保持滚动条位置的功能
示例代码:
这样能基本上实现一个能够锁定表头、竖向滚动、能够在页面PostBack时保持滚动位置的表格,能够满足大部分应用需要。