创建固定表头、表格体滚动的DataGrid(c#版)

最新推荐文章于 2023-09-28 14:58:46 发布

东风E9527

最新推荐文章于 2023-09-28 14:58:46 发布

阅读量2k

点赞数

分类专栏：学习笔记文章标签： datagrid c# table asp microsoft null

本文链接：https://blog.youkuaiyun.com/cx12cn/article/details/358469

版权

学习笔记专栏收录该内容

12 篇文章

订阅专栏

本文提供了一段C#代码，用于创建一个ASP.NET页面，展示了一个具有固定表头且表格体可滚动的DataGrid。通过设置表头和表格体样式，实现了表头在滚动时始终保持可见的效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在使用DataGrid时，有时候需要表头表头固定、表格体的内容可以滚动，下面的代码就是实现这个功能的代码。

ShowFixedHeader.aspx内容:

<%@ Page language="c#" Codebehind="ShowFixedHeader.aspx.cs" AutoEventWireup="false" Inherits="bShowFixedHeader.ShowFixedHeader" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
  <title id="lucky_elove"></title>
  <meta name="GENERATOR" content="Microsoft Visual Studio.NET 7.0">
  <meta name="CODE_LANGUAGE" content="Visual Basic 7.0">
  <meta name="vs_defaultClientScript" content="JavaScript">
  <meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
</HEAD>
<body MS_POSITIONING="GridLayout" leftmargin="0">
  <table align="center">
   <tr>
    <td>
     <form id="Form1" method="post" runat="server">
      <TABLE id="Table1" runat="server" cellSpacing="1" cellPadding="2" width="736" border="1"
       bgcolor="#cc6633" bordercolor="#cc9966" style="FONT-SIZE:9pt;WIDTH:736px;BORDER-BOTTOM:0px;HEIGHT:46px">
       <TR align="center">
        <TD colspan="2" width="500" style="WIDTH: 500px"></TD>
        <TD width="190" colspan="2"></TD>
       </TR>
       <TR align="center">
        <TD width="300" bgcolor="#66cc99" style="WIDTH: 300px"></TD>
        <TD width="149" bgcolor="white" style="WIDTH: 149px"></TD>
        <TD width="102" bgcolor="#99cccc" style="WIDTH: 102px"></TD>
        <TD width="40" bgcolor="#009999"></TD>
       </TR>
      </TABLE>
      <div style="BORDER-RIGHT:0px;PADDING-RIGHT:0px;BORDER-TOP:0px;PADDING-LEFT:0px;PADDING-BOTTOM:0px;MARGIN:0px;OVERFLOW:auto;BORDER-LEFT:0px;WIDTH:736px;PADDING-TOP:0px;BORDER-BOTTOM:0px;HEIGHT:200px">
       <asp:DataGrid id="DataGrid1" width="720px" CellPadding="2" CellSpacing="1" BorderColor="#cc9966"
        Font-Size="9pt" AlternatingItemStyle-BackColor="#6699ff" runat="server" ShowHeader="False"
        AutoGenerateColumns="False">
        <Columns>
         <asp:BoundColumn DataField="Title">
          <ItemStyle Width="360px"></ItemStyle>
         </asp:BoundColumn>
         <asp:BoundColumn DataField="CreateDate">
          <ItemStyle Width="180px" HorizontalAlign="Center"></ItemStyle>
         </asp:BoundColumn>
         <asp:BoundColumn DataField="">
          <ItemStyle Width="140px" HorizontalAlign="Center"></ItemStyle>
         </asp:BoundColumn>
         <asp:BoundColumn DataField="">
          <ItemStyle Width="40px" HorizontalAlign="Center"></ItemStyle>
         </asp:BoundColumn>
        </Columns>
       </asp:DataGrid>
      </div>
     </form>
    </td>
   </tr>
  </table>
</body>
</HTML>

ShowFixedHeader.aspx.cs内容:

using System;
using Microsoft.VisualBasic;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Data.OleDb;

namespace bShowFixedHeader
{
public class ShowFixedHeader : System.Web.UI.Page
{
  protected System.Web.UI.HtmlControls.HtmlTable Table1 = null;
  protected System.Web.UI.WebControls.DataGrid DataGrid1 = null;
  protected System.Web.UI.HtmlControls.HtmlForm Form1 = null;
  //protected HtmlControls.HtmlGenericControl lucky_elove = null;

  #region Web 窗体设计器生成的代码
  override protected void OnInit(EventArgs e)
  {
   //
   // CODEGEN: 该调用是 ASP.NET Web 窗体设计器所必需的。
   //
   InitializeComponent();
   base.OnInit(e);
  }

  /// <summary>
  /// 设计器支持所需的方法 - 不要使用代码编辑器修改
  /// 此方法的内容。
  /// </summary>
  private void InitializeComponent()
  {
   this.Load += new System.EventHandler(this.Page_Load);
   this.Load += new System.EventHandler (Page_Load);
   this.DataGrid1.ItemDataBound += new System.Web.UI.WebControls.DataGridItemEventHandler (DataGrid1_ItemDataBound);

}
#endregion

  private void Page_Load(System.Object sender,System.EventArgs e)
  {
   // lucky_elove.InnerText = "【孟宪会之精彩世界】 - 跨栏表头的实现"
   Table1.Rows[0].Cells[0].InnerText = "【孟宪会之精彩世界】.NET版本之最新文章";
   Table1.Rows[0].Cells[1].InnerText = "文章信息";
   Table1.Rows[1].Cells[0].InnerText = "文章标题";
   Table1.Rows[1].Cells[1].InnerText = "发布时间";
   Table1.Rows[1].Cells[2].InnerText = "所属栏目";
   Table1.Rows[1].Cells[3].InnerText = "点击率";
   Table1.Rows[0].Style.Add("color", "white");
   Table1.Rows[0].Style.Add("font-weight", "bold");
   Table1.Rows[0].Cells[0].Attributes.Add("onclick", "window.open('http://lucky_elove.www1.dotnetplayground.com/')");
   Table1.Rows[0].Cells[0].Style.Add("cursor", "hand");
   try
   {
    string cnString = "Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" + Server.MapPath("Web.mdb");
    OleDbConnection cn = new OleDbConnection (cnString);
    cn.Open();
    string strSQL = "SELECT TOP 30 Title ,CreateDate ,Author FROM Document";
    OleDbCommand cmd = new OleDbCommand (strSQL,cn);
    DataGrid1.DataSource = cmd.ExecuteReader();
    DataGrid1.DataBind();
    cn.Close();
    cn = null;
   }
   catch (OleDbException eOle )
   {
    Response.Write("产生错误：" + eOle.Message);
   }
  }

  private void DataGrid1_ItemDataBound(object sender,System.Web.UI.WebControls.DataGridItemEventArgs e)
  {
   if (e.Item.ItemType == ListItemType.Item | e.Item.ItemType == ListItemType.AlternatingItem)
   {
    if (e.Item.Cells[0].Text.Length > 26)
    {
     e.Item.Cells[0].Attributes.Add("Title", e.Item.Cells[0].Text);
     e.Item.Cells[0].Text = e.Item.Cells[0].Text.Substring(0, 26) + "…";
    }
    //e.Item.Cells[1].Text = Format(System.Convert.ToDateTime(e.Item.Cells[1].Text), "yyyy年M月d日 h点m分s秒");
    e.Item.Cells[1].Text = (System.Convert.ToDateTime(e.Item.Cells[1].Text)).ToString( "yyyy年M月d日 h点m分s秒");

   }
  }
}
}