C#編輯GridView的Thead
阿新 • • 發佈：2020-04-12
背景
有這樣一個需求，需要更改GridView的Thead,即表頭。不只是多行表頭，而是任意的內容，可能是一段文字，也可能是一個圖片，綜合網上的一些資料，大致整理出一些做法。
內容
大致有兩種方法
第一種，就是在表頭裡塞元素，通過後臺程式碼一個個地新增，包括排版樣式等等。這樣做其實比較麻煩，主要是不直觀，不熟悉的話就需要一步步除錯。
第二種，就是在前端寫出內容，調整樣式，放在一個容器裡（Div或者Table），注意需要是伺服器控制元件，即需要新增ID，並設定runat="server"。然後在後臺獲取此容器內容新增到Thead的一行中即可。
現在我們具體來做。
方法一
前端
<asp:GridView ID="gvDataList" runat="server" CssClass="table-condensed table-hover"
BorderStyle="None" CellPadding="0" GridLines ="None"
AutoGenerateColumns="False" OnPreRender="GridView1_PreRender" OnRowCreated="GridView1_RowCreated" >
……
後臺
protected void GridView1_PreRender(object sender,EventArgs e) {if (gvDataList.Rows.Count > 0) { // 使用<TH>替換<TD> gvDataList.UseAccessibleHeader = true; gvDataList.HeaderRow.TableSection = TableRowSection.TableHeader; gvDataList.FooterRow.TableSection = TableRowSection.TableFooter; } }protected void GridView1_RowCreated(object sender,GridViewRowEventArgs e) { switch (e.Row.RowType) { case DataControlRowType.Header: e.Row.BackColor = System.Drawing.Color.White;//去除底色 TableCellCollection tcHeader = e.Row.Cells; tcHeader.AddAt(0,new TableHeaderCell()); tcHeader[0].Text = "表格1"; tcHeader[0].Attributes.Add("colspan","2"); tcHeader[0].Attributes.Add("style","height:30px;"); tcHeader.AddAt(1,new TableHeaderCell()); tcHeader[1].Text = "表格2"; tcHeader[1].Attributes.Add("colspan","2"); tcHeader[1].Attributes.Add("style","height:30px;"); tcHeader.AddAt(2,new TableHeaderCell()); tcHeader[2].Text = "表格3"; tcHeader[2].Attributes.Add("colspan","4"); tcHeader[2].Attributes.Add("style","height:30px;"); tcHeader.AddAt(3,new TableHeaderCell()); tcHeader[3].Text = "表格4</tr><tr>"; tcHeader[3].Attributes.Add("colspan","2"); tcHeader[3].Attributes.Add("style","text-align:right;height:30px;"); break; } }
方法二
前端
<table id="TBHead" runat="server" border="0" align="center" width="1000px" cellspacing="0" cellpadding="0" class="main"> <tr> <td colspan="1" class="style1"> <asp:TextBox ID="txtFtype" runat="server" class="HeadType"></asp:TextBox> </td> <td colspan="2" rowspan="2" class="style1"> <asp:Label ID="lblHeaderF" runat="server" class="HeadTitle"></asp:Label> </td> <td colspan="1" class="style1"> <asp:Label ID="lbldate" runat="server" class="HeadTime"></asp:Label> </td> </tr> </table> <asp:GridView ID="gvDataList" runat="server" CssClass="table-condensed table-hover" BorderStyle="None" CellPadding="0" GridLines ="None" AutoGenerateColumns="False" OnPreRender="GridView1_PreRender" OnRowCreated="GridView1_RowCreated" >
……
後臺
protected void GridView1_PreRender(object sender,EventArgs e) { if (gvDataList.Rows.Count > 0) { // 使用<TH>替換<TD> gvDataList.UseAccessibleHeader = true; gvDataList.HeaderRow.TableSection = TableRowSection.TableHeader; gvDataList.FooterRow.TableSection = TableRowSection.TableFooter; } } protected void GridView1_RowCreated(object sender,GridViewRowEventArgs e) { switch (e.Row.RowType) { case DataControlRowType.Header: e.Row.BackColor = System.Drawing.Color.White;//去除底色 TableCellCollection tcHeader = e.Row.Cells;
tcHeader.AddAt(0,new TableHeaderCell()); tcHeader[0].Attributes.Add("colspan","10"); tcHeader[0].Text = "</tr><tr>"; HtmlTable demo = TBHead; tcHeader[0].Controls.Add(demo); tcHeader.AddAt(1,new TableHeaderCell()); tcHeader[1].Text = "</tr><tr style=\"background-color: #D9EDF7;\">"; break; } }