打印

[asp.net教程] 创建表头固定,表体可滚动的gridview

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

TOP

返回顶部
AYBlue

Processed in 0.051976 second(s), 7 queries.

当前时区 GMT+8, 现在时间是 2009-1-10 10:57 京ICP备06054220号

清除 Cookies - 联系我们 - 163K.com - Archiver - WAP