创建表头固定,表体可滚动的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>

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值