zoukankan      html  css  js  c++  java
  • 创建表头固定,表体可滚动的GridView(转)

    本方法只需要设置一个GridView的宽度,其它宽度不需要设置。测试环境:IE6,Firefox通过。

    C#

    <%@ 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>

    VB.NET

    <%@ Page Language="VB" %>

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <script runat="server">
      Function CreateDataSource() As ICollection
        Dim dt As System.Data.DataTable = New System.Data.DataTable
        Dim dr As System.Data.DataRow
        dt.Columns.Add(New System.Data.DataColumn("学生班级", GetType(System.String)))
        dt.Columns.Add(New System.Data.DataColumn("学生姓名", GetType(System.String)))
        dt.Columns.Add(New System.Data.DataColumn("语文", GetType(System.Decimal)))
        dt.Columns.Add(New System.Data.DataColumn("数学", GetType(System.Decimal)))
        dt.Columns.Add(New System.Data.DataColumn("英语", GetType(System.Decimal)))
        dt.Columns.Add(New System.Data.DataColumn("计算机", GetType(System.Decimal)))
        Dim i As Integer = 0
        While i < 50
          Dim rd As System.Random = 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.Math.Min(System.Threading.Interlocked.Increment(i), i - 1)
        End While
        Dim dv As System.Data.DataView = New System.Data.DataView(dt)
        Return dv
      End Function

      Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)
        If Not IsPostBack Then
          GridView1.Attributes.Add("style", "table-layout:fixed")
          GridView1.DataSource = CreateDataSource()
          GridView1.DataBind()
        End If
      End Sub

    </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>

  • 相关阅读:
    [Javascript] Broadcaster + Operator + Listener pattern -- 10. Define a Function to Set Common Behaviors in Operators
    [Java Spring] Aspect
    [Javascript] Broadcaster + Operator + Listener pattern -- 24. Design choice, ifElse or merge
    [Javascript] Broadcaster + Operator + Listener pattern -- 23. ifElse operator
    [Git] Revert to a old commit
    [Tools] Dendron
    [Java Spring] Spring Expression Language
    [Java Spring] @Profile
    [Java Spring] @Value & override properties by environment variables
    [Java Spring] Implementing Spring Security
  • 原文地址:https://www.cnblogs.com/footleg/p/1183989.html
Copyright © 2011-2022 走看看