GridviewでTHEADをレンダリングするにはどうすればよいですか?


112

タグGridViewをレンダリングするためのコントロールを取得するにはどうすればよい<thead> <tbody>ですか?私.UseAccessibleHeadersはそれをの<th>代わりに置くことを知ってい<td>ますが、<thead>を表示させることができません。


参考:UseAccessibleHeaderはデフォルトで「true」であるため、設定する必要はありません。 msdn.microsoft.com/en-us/library/...
MikeTeeVee

回答:


187

これはそれを行うはずです:

gv.HeaderRow.TableSection = TableRowSection.TableHeader;

69
HeaderRowプロパティは次のようになりますnullまで、GridViewデータがバインドされていますので、データバインディングは、上記のコード行を実行する前に発生したまで待機することを確認してください。
bdukes

6
以下のコメントのように、少なくともバインド後のASP.NET 4.5では、十分な遅延はありません。ただし、OnPreRenderでは機能します。
philw 2013

カスタムサブヘッダーが追加されたグリッドビューがあります。これらの各サブヘッダーには、データソースからのデータが表示されます。レンダリングしたかったのtheadは、jQueryで使用するためです。ただし、ヘッダーをレンダリングした後、tbodyは使用できないようです。私の場合、何が欠けているのでしょうか?
bonCodigo 14

1
ポストバック中にまだ問題があることがわかり、すべてのシナリオに対処するコードをデータバインドイベントに配置しました。
James Westgate

ユーザーがボタンをクリックしたときに、データベースからデータを取得します。その場合、gridviewにはtheadタグがありません。何か助けは?
touinta

25

私はこれをOnRowDataBoundイベントで使用します:

protected void GridViewResults_OnRowDataBound(object sender, GridViewRowEventArgs e) {
    if (e.Row.RowType == DataControlRowType.Header) {
        e.Row.TableSection = TableRowSection.TableHeader;
    }
}

7
これは私のために働いた唯一の解決策です。誰がこれらのひどいコントロールを設計しましたか?
EKW 2016

2
OnRowCreatedイベントにコードを挿入し、正しく動作させました。
yougotiger 2018年

これは、DataSource内に行がない場合にTableSectionがnullになるリスク(および必要なチェック)がなくなるため、最適なソリューションです。
EvilDr 2018年

1
Fyi、GridViewが内にUpdatePanelあり、非同期ポストバックが他のコントロールによって引き起こされている場合、OnRowDataBoundイベントは発生しないため、この回答のコードは実行されGridViewず、<thead>タグなしのレンダリングに戻ります... ため息。このケースを対象とするには、受け入れられた回答からgridViewのPreRenderイベントハンドラーにコードを押し込みますASalvoの回答が示唆するように)。
Mr.Z、

これは正解です。WebFormsワークフローを適切に使用しているからです。
マルセル

10

回答のコードは、Page_Loadまたはに進む必要がありますGridView_PreRender。後で呼び出されるメソッドに入れてPage_Loadを取得しましたNullReferenceException


4
DataBoundイベントに入れることもできます。grid.DataBound += (s, e) => { grid.HeaderRow.TableSection = TableRowSection.TableHeader; };
BrunoLM 2010

4
これが.NET 4.5で現在異なるかどうかはわかりませんが、_DataBoundおよび_PreRenderイベントハンドラーの両方でHeaderRowがnullになっています。これは、gridViewでASP.NET Webフォームの新しい「モデルバインディング」機能を使用しているという事実に関連している可能性があります。
ClearCloud8 2012年

7

これを行うには、次のコードを使用します。

if私は追加の文が重要です。

それ以外の場合(グリッドのレンダリング方法によって異なります)、次のような例外がスローされます。

テーブルには、ヘッダー、本文、フッターの順に行セクションが含まれている必要があります。

protected override void OnPreRender(EventArgs e)
{
    if ( (this.ShowHeader == true && this.Rows.Count > 0)
      || (this.ShowHeaderWhenEmpty == true))
    {
        //Force GridView to use <thead> instead of <tbody> - 11/03/2013 - MCR.
        this.HeaderRow.TableSection = TableRowSection.TableHeader;
    }
    if (this.ShowFooter == true && this.Rows.Count > 0)
    {
        //Force GridView to use <tfoot> instead of <tbody> - 11/03/2013 - MCR.
        this.FooterRow.TableSection = TableRowSection.TableFooter;
    }
    base.OnPreRender(e);
}

thisオブジェクトは、私のGridViewのです。

実際にAsp.net GridViewをオーバーライドして独自のカスタムコントロールを作成しましたが、これをaspx.csページに貼り付けて、カスタムグリッドビューアプローチを使用する代わりに名前でGridViewを参照することもできます。

参考までに、私はフッターロジックをテストしていませんが、これがヘッダーで機能することはわかっています。


5

これは私にとってはうまくいきます:

protected void GrdPagosRowCreated(object sender, GridViewRowEventArgs e)
{
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        e.Row.TableSection = TableRowSection.TableBody;
    }
    else if (e.Row.RowType == DataControlRowType.Header)
    {
        e.Row.TableSection = TableRowSection.TableHeader;
    }
    else if (e.Row.RowType == DataControlRowType.Footer)
    {
        e.Row.TableSection = TableRowSection.TableFooter;
    }
}

これはVS2010で試されました。


2

関数を作成し、次のPageLoadようにイベントでその関数を使用します。

関数は次のとおりです。

private void MakeGridViewPrinterFriendly(GridView gridView) {  
    if (gridView.Rows.Count > 0) {          
        gridView.UseAccessibleHeader = true;  
        gridView.HeaderRow.TableSection = TableRowSection.TableHeader;  
    }  
} 

PageLoadイベントは次のとおりです。

protected void Page_Load(object sender, EventArgs e) {
        if (!IsPostBack)
        {
            MakeGridViewPrinterFriendly(grddata);
        }
}

1

私はこれが古いことを知っていますが、標準のグリッドビューに対するMikeTeeVeeの回答の解釈を次に示します。

aspxページ:

<asp:GridView ID="GridView1" runat="server" 
    OnPreRender="GridView_PreRender">

aspx.cs:

    protected void GridView_PreRender(object sender, EventArgs e)
    {
        GridView gv = (GridView)sender;

        if ((gv.ShowHeader == true && gv.Rows.Count > 0)
            || (gv.ShowHeaderWhenEmpty == true))
        {
            //Force GridView to use <thead> instead of <tbody> - 11/03/2013 - MCR.
            gv.HeaderRow.TableSection = TableRowSection.TableHeader;
        }
        if (gv.ShowFooter == true && gv.Rows.Count > 0)
        {
            //Force GridView to use <tfoot> instead of <tbody> - 11/03/2013 - MCR.
            gv.FooterRow.TableSection = TableRowSection.TableFooter;
        }

    }

0

jQueryを使用して追加することもできます。これにより、PostBackでドロップされるTableRowSection.TableHeaderの問題が回避されます。

$('#myTableId').prepend($("<thead></thead>").append($(this).find("#myTableId tr:first")));

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.