我现在用GRIDVIEW显示数据时,由于列太多,导致拖到最右边时看不清数据对应的是那条记录,现在想用冻结列的方式固定前几列,在网上查了很多例子,用CSS方式控制,可都没效果,下了个YYCONTROLS设置了冻结列,也不起作用,请各位WEB专家给指点一下如何冻结列?
------解决方案--------------------------------------------------------
http://www.cnblogs.com/webabcd/archive/2007/01/15/620501
------解决方案--------------------------------------------------------
不知道你到底是在说什么效果?如果列多就隐藏吗,还冻结??字体变灰就是冻结了???照样对多列数据的显示造成困难~~,你还是从UI设计思维上考虑吧~~
------解决方案--------------------------------------------------------
http://birdshome.cnblogs.com/archive/2006/05/01/ScrollTable
这个是效果
http://birdshome.cnblogs.com/archive/2006/05/13/ScrollTableDetails
这个是源~{有些慢,但肯定能打开的}
------解决方案--------------------------------------------------------
晕啊,第一次使用 asp.net就搞这么复杂的。
下面是测试的例子
- HTML code
<%@ Page Language="C#" EnableViewState="false" %><script runat="server"> // 计算数据,完全可以从数据看取得 ICollection CreateDataSourceByXianhuiMeng() { System.Data.DataTable dt = new System.Data.DataTable(); System.Data.DataRow dr; dt.Columns.Add(new System.Data.DataColumn("学生班级", typeof(System.String))); dt.Columns.Add(new System.Data.DataColumn("学生姓名", typeof(System.String))); dt.Columns.Add(new System.Data.DataColumn("语文", typeof(System.Decimal))); dt.Columns.Add(new System.Data.DataColumn("数学", typeof(System.Decimal))); dt.Columns.Add(new System.Data.DataColumn("英语", typeof(System.Decimal))); dt.Columns.Add(new System.Data.DataColumn("计算机", typeof(System.Decimal))); for (int i = 0; i < 20; i++) { System.Random rd = new System.Random(Environment.TickCount * i); ; dr = dt.NewRow(); dr[0] = "班级" + i.ToString(); dr[1] = "【孟子E章】" + i.ToString(); dr[2] = System.Math.Round(rd.NextDouble() * 100, 2); dr[3] = System.Math.Round(rd.NextDouble() * 100, 2); dr[4] = System.Math.Round(rd.NextDouble() * 100, 2); dr[5] = System.Math.Round(rd.NextDouble() * 100, 2); dt.Rows.Add(dr); } System.Data.DataView dv = new System.Data.DataView(dt); return dv; } protected void Page_Load(object sender, EventArgs e) { if (!Page.IsPostBack) { GridView1.DataSource = CreateDataSourceByXianhuiMeng(); GridView1.DataBind(); } } protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e) { } </script><html xmlns="http://www.w3.org/1999/xhtml"><head id="Head1" runat="server"> <script type="text/javascript"> var tblID = "<%=GridView1.ClientID %>";function lockCol() { var table = document.getElementById(tblID); var cTR = table.getElementsByTagName('TR'); //collection of rows if (table.rows[0].cells[0].className == '') { for (i = 0; i < cTR.length; i++) { var tr = cTR.item(i); tr.cells[0].className = 'locked' } } else { for (i = 0; i < cTR.length; i++) { var tr = cTR.item(i); tr.cells[0].className = '' } }}function createHeadBody(){var t = document.getElementById(tblID);var h = t.createTHead()h.appendChild(t.tBodies[0].firstChild)t.parentNode.id = "tbl-container";lockCol()}window.onload = createHeadBody; </script> <style type="text/css"> div#tbl-container { width: 418px; height: 252px; overflow: auto; scrollbar-base-color: #ffeaff; } table { table-layout: fixed; border-collapse: collapse; background-color: WhiteSmoke; } div#tbl-container table th { width: 120px; } thead th, thead th.locked { font-size: 14px; font-weight: bold; text-align: center; background-color: navy; color: white; border-right: 1px solid silver; position: relative; cursor: default; } thead th { top: expression(document.getElementById( "tbl-container" ).scrollTop-2); /* IE5+ only */ z-index: 20; } thead th.locked { z-index: 30; } td.locked, th.locked { background-color: #ffeaff; font-weight: bold; border-right: 1px solid silver; left: expression(parentNode.parentNode.parentNode.parentNode.scrollLeft); /* IE5+ only */ position: relative; z-index: 10; } </style></head><body> <form id="form1" runat="server"> <asp:GridView ID="GridView1" runat="server" OnRowDataBound="GridView1_RowDataBound"> <HeaderStyle BackColor="#EDEDED" /> <Columns> <asp:TemplateField HeaderText="模版列"> <ItemTemplate> <%#Eval("学生姓名") %> </ItemTemplate> </asp:TemplateField> </Columns> </asp:GridView> </form></body></html>