GridView表头固定 滚动
搜到几个都没成功
1.孟子
<script type= "text/javascript ">
function s()
{
var t = document.getElementById( " <%=GridView1.ClientID%> ");
var t2 = t.cloneNode(true)
for(i = t2.rows.length -1;i > 0;i--)
t2.deleteRow(i)
t.deleteRow(0)
a.appendChild(t2)
}
window.onload = s()
</script>
<div id=a> </div>
这个t等于null
2.singlepine
http://singlepine.cnblogs.com/archive/2005/10/30/265019.html
没搞成
3.最简单的一个
<style>
.Freezing
{
position:relative ;
table-layout:fixed;
top:expression(this.offsetParent.scrollTop);
left:expression(this.offsetParent.scrollLeft);
z-index: 10;
}
</style>
<HeaderStyle BackColor= "#cc0000 " Font-Bold= "True " CssClass= "Freezing " ForeColor= "#E7E7FF " />
这个基本可以，
但是 1.比如把网页缩小后表头移位
2.隐约能看到表体有一点点到了表头的上面
谁有好方法不
?
我的数据是动态绑定的
[解决办法]
/*
合并且固定表头：
BUG：在IE6上滑动条移动后如表格内容中存在dropdownlist，则dropdownlist将与表格叠加，这个问题估计是IE6的BUG
前台：
(注意：DataGrid的HeaderStyle中加入这句CssClass= "Freezing ")
(注意：DataGrid的边框会存在白边，将边线颜色和表头背景颜色设为同一种颜色，BorderStyle= "None ")
Author:QQ:50382187
*/
<head>
<style> .Freezing {
TABLE-LAYOUT: fixed; Z-INDEX: 10; POSITION: relative; ; TOP: expression(this.offsetParent.scrollTop)
}
.Freezing TH {
PADDING-RIGHT: 2px; PADDING-LEFT: 2px; PADDING-BOTTOM: 2px; OVERFLOW: hidden; PADDING-TOP: 2px; WHITE-SPACE: nowrap
}
</style>
<head>
...
<div style= "OVERFLOW-Y: scroll; Z-INDEX: 101; LEFT: 16px; WIDTH: 560px; POSITION: absolute; TOP: 48px; HEIGHT: 216px "> <asp:datagrid id= "DataGrid1 " runat= "server " BorderStyle= "None " BorderColor= "MediumSeaGreen " Height= "104px "
Width= "552px " HorizontalAlign= "Center " BorderWidth= "1px " AutoGenerateColumns= "False ">
<HeaderStyle ForeColor= "White " CssClass= "Freezing " BackColor= "MediumSeaGreen "> </HeaderStyle>
<Columns>
<asp:TemplateColumn>
<ItemTemplate>
<asp:DropDownList id= "DropDownList1 " runat= "server " DataSource= ' <%# ddlBindName()%> ' DataValueField= "CompanyName " DataTextField= "CompanyName ">
</asp:DropDownList>
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn>
<ItemTemplate>
<asp:DropDownList id= "Dropdownlist2 " runat= "server " DataSource= ' <%# ddlBindDimensions()%> ' DataValueField= "ContactName " DataTextField= "ContactName ">
</asp:DropDownList>
</ItemTemplate>
</asp:TemplateColumn>
<asp:BoundColumn DataField= "ContactTitle "> </asp:BoundColumn>
<asp:BoundColumn DataField= "Address "> </asp:BoundColumn>
<asp:BoundColumn DataField= "City "> </asp:BoundColumn>
<asp:BoundColumn DataField= "Region "> </asp:BoundColumn>
<asp:BoundColumn DataField= "PostalCode "> </asp:BoundColumn>
<asp:BoundColumn DataField= "Country "> </asp:BoundColumn>
</Columns>
</asp:datagrid>
</div>
后台：
private void DataGrid1_ItemCreated(object sender, System.Web.UI.WebControls.DataGridItemEventArgs e)
{
switch (e.Item.ItemType)
{
case ListItemType.Header:
//第一行表头
TableCellCollection tcHeader = e.Item.Cells;
tcHeader.Clear();
tcHeader.Add(new TableHeaderCell());
tcHeader[tcHeader.Count-1].Attributes.Add( "colspan ", "2 "); //跨Row
tcHeader[tcHeader.Count-1].Attributes.Add( "bgcolor ", "MediumSeaGreen ");
tcHeader[tcHeader.Count-1].Text = "标题A ";
tcHeader.Add(new TableHeaderCell());
tcHeader[tcHeader.Count-1].Attributes.Add( "colspan ", "2 "); //跨Row
tcHeader[tcHeader.Count-1].Attributes.Add( "bgcolor ", "MediumSeaGreen ");
tcHeader[tcHeader.Count-1].Text = "标题B ";
tcHeader.Add(new TableHeaderCell());
tcHeader[tcHeader.Count-1].Attributes.Add( "colspan ", "2 "); //跨Row
tcHeader[tcHeader.Count-1].Attributes.Add( "bgcolor ", "MediumSeaGreen ");
tcHeader[tcHeader.Count-1].Text = "标题C ";
tcHeader.Add(new TableHeaderCell());
tcHeader[tcHeader.Count-1].Attributes.Add( "colspan ", "2 "); //跨Row
tcHeader[tcHeader.Count-1].Attributes.Add( "bgcolor ", "MediumSeaGreen ");
tcHeader[tcHeader.Count-1].Text = "标题D </tr> <tr class=\ "Freezing\ " style=\ "color:White;background-color:MediumSeaGreen;\ "> ";
tcHeader.Add(new TableHeaderCell());
tcHeader[tcHeader.Count-1].Attributes.Add( "bgcolor ", "MediumSeaGreen ");
tcHeader[tcHeader.Count-1].Text = "标题1 ";
tcHeader.Add(new TableHeaderCell());
tcHeader[tcHeader.Count-1].Attributes.Add( "bgcolor ", "MediumSeaGreen ");
tcHeader[tcHeader.Count-1].Text = "标题2 ";
tcHeader.Add(new TableHeaderCell());
tcHeader[tcHeader.Count-1].Attributes.Add( "colspan ", "2 "); //跨Row
tcHeader[tcHeader.Count-1].Attributes.Add( "bgcolor ", "MediumSeaGreen ");
tcHeader[tcHeader.Count-1].Text = "标题3 ";
tcHeader.Add(new TableHeaderCell());
tcHeader[tcHeader.Count-1].Attributes.Add( "colspan ", "2 "); //跨Row
tcHeader[tcHeader.Count-1].Attributes.Add( "bgcolor ", "MediumSeaGreen ");
tcHeader[tcHeader.Count-1].Text = "标题4 ";
tcHeader.Add(new TableHeaderCell());
tcHeader[tcHeader.Count-1].Attributes.Add( "bgcolor ", "MediumSeaGreen ");
tcHeader[tcHeader.Count-1].Text = "标题5 ";
tcHeader.Add(new TableHeaderCell());
tcHeader[tcHeader.Count-1].Attributes.Add( "bgcolor ", "MediumSeaGreen ");
tcHeader[tcHeader.Count-1].Text = "标题6 ";
break;
}
}
[解决办法]
datagrid的例子,改一上就OK了
[解决办法]
还没得过100分,楼主给分
[解决办法]
刚贴上来格式还是乱的,怎么现在整齐了
[解决办法]
TABLE-LAYOUT: fixed;
这句固定表头
页面 缩小放大后 不影响表格
代码我一直在用,没问题
[解决办法]
可以,再试试吧
[解决办法]
注意：DataGrid的边框会存在白边，将边线颜色和表头背景颜色设为同一种颜色，BorderStyle= "None ")
