关闭

Girdview实现滚动条效果,并且Head部分不滚动

414人阅读 评论(0) 收藏 举报

方法一:

在aspx加入下列script,在Gridview1的上边加一个<div id="Head"></div>,原理就是克隆一份Gridview的Head部分,添加到Div中,然后将gridview自己的head删除。

 

<script type="text/javascript">

    
function SetHead()
     
    
{
        
if(document.getElementById("<%=GridView1.ClientID%>"))
        
{
             
var GridTable = document.getElementById("<%=GridView1.ClientID%>");
     
             
             
var GridNodes = GridTable.cloneNode(true)
     
             
for(i = GridNodes.rows.length -1;i > 0;i--)
     
             GridNodes.deleteRow(i)  
     
             GridTable.deleteRow(
0)  
     
             Head.appendChild(GridNodes) 
        }

    }

     
    window.onload 
= SetHead

</script>

 

方法二:

使用样式,在App_Themes 中建立一皮肤文件,在样式css文件中如下
 .FreezingRow
{ 
   position
:relative ;
   top
:expression(this.offsetParent.scrollTop); 
   z-index
: 10; 
}
 
 
 
<asp:Panel ID="ScrollTable" runat="server" Width="99%" Style="overflow-y: auto; height: 450px;
            position: relative; margin: 0 auto; word-break:break-all; word-wrap:break-word;"
  
    <asp:GridView ID
="GridView2" runat="server" AutoGenerateColumns="False" AllowPaging="True"
                    PageSize
="100" Width="95%" >
        
<Columns>
            
<asp:BoundField HeaderText="<%$ Resources:TempoMongon %>">
                
<ItemStyle Width="10%" HorizontalAlign="Left" />
                
<HeaderStyle CssClass="FreezingRow" />
            
</asp:BoundField>
            
<asp:BoundField HeaderText="<%$ Resources:NamaeMongon %>" DataField="KJ_SYAINMEI">
                
<ItemStyle Width="10%" HorizontalAlign="Left" />
                
<HeaderStyle CssClass="FreezingRow" />
            
</asp:BoundField>
            
<asp:BoundField HeaderText="<%$ Resources:KengenMongon %>">
                
<ItemStyle Width="10%" HorizontalAlign="Left" />
                
<HeaderStyle CssClass="FreezingRow" />
            
</asp:BoundField>
         
</Columns>
               
    
</asp:GridView>
</asp:Panel>
 
也就是用panel的滚动条,控制gridview的头使其不动。第二种方法有个缺点,就是gridview的模版列中如果存在dropdownlist,样式就变了,就只能用上一种方法实现了。有需要代码的可以联系我,chfzhb@163.com  
0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:245180次
    • 积分:3373
    • 等级:
    • 排名:第9980名
    • 原创:21篇
    • 转载:306篇
    • 译文:3篇
    • 评论:42条