如何实现gridview中滚动条?首行的标题行不动,可能滚动条浏览数据?如何实现?

解决方案 »

  1.   

    固定表头
     <style>
    .Freezing
       {
       position:relative ;
       table-layout:fixed;
       top:expression(this.offsetParent.scrollTop);  
       z-index: 10;
       }
    .Freezing th{text-overflow:ellipsis;overflow:hidden;white-space: nowrap;padding:2px;}
    </style> <HeaderStyle BackColor="#006699" Font-Bold="True" ForeColor="White" CssClass="Freezing"/>http://topic.csdn.net/u/20090324/11/8451f630-adc5-44ba-a6fd-a55645773663.html
      

  2.   

    试试下面效果:
    固定头带滚动条(不使用Panel控件)的GridView
      

  3.   


    <%@ Page Language="C#" AutoEventWireup="true" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><script runat="server">
      // 计算数据,完全可以从数据看取得
      ICollection CreateDataSource( )
      {
        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 < 50; 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 (!IsPostBack)
        {
          GridView1.Attributes.Add("style", "table-layout:fixed");
          GridView1.DataSource = CreateDataSource();
          GridView1.DataBind();
        }
      }
      </script><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>
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
      <title>创建表头固定,表体可滚动的GridView</title>
    </head>
    <body>
      <form id="Form1" runat="server">
        <table>
          <tr>
            <td>
              <div id="a">
              </div>
              <div style="overflow-y: scroll; height: 200px">
                <asp:GridView ID="GridView1" runat="server" Font-Size="12px" BackColor="#FFFFFF"
                  GridLines="Both" CellPadding="4" Width="560">
                  <HeaderStyle BackColor="#EDEDED" Height="26px" />
                </asp:GridView>
              </div>
            </td>
          </tr>
        </table>
      </form>
    </body>
    </html>