32 votes

La deuxième ligne d'en-tête ASP.NET GridView s'étend sur la ligne d'en-tête principale

J'ai un ASP.NET GridView qui a des colonnes qui ressemblent à ceci:

| Foo | Bar | Total1 | Total2 | Total3 |

Est-il possible de créer un en-tête sur les deux lignes qui ressemble à ceci?

|           |  Totals   |    
| Foo | Bar | 1 | 2 | 3 |

Les données de chaque ligne demeureront inchangés, comme c'est juste à peu jusqu'à l'en-tête et de diminuer l'espace horizontal que la grille prend.

L'ensemble de la GridView est triable dans le cas où des questions. Je n'ai pas l'intention de l'ajout de "Totaux" couvrant la colonne d'avoir toute la fonctionnalité de tri.

Edit:

Basé sur l'un des articles ci-dessous, j'ai créé une classe qui hérite de GridView et ajoute de la deuxième ligne d'en-tête.

namespace CustomControls
{
    public class TwoHeadedGridView : GridView
    {
        protected Table InnerTable
        {
            get
            {
                if (this.HasControls())
                {
                    return (Table)this.Controls[0];
                }

                return null;
            }
        }

        protected override void OnDataBound(EventArgs e)
        {
            base.OnDataBound(e);
            this.CreateSecondHeader();
        }

        private void CreateSecondHeader()
        {
            GridViewRow row = new GridViewRow(0, -1, DataControlRowType.Header, DataControlRowState.Normal);

            TableCell left = new TableHeaderCell();
            left.ColumnSpan = 3;
            row.Cells.Add(left);

            TableCell totals = new TableHeaderCell();
            totals.ColumnSpan = this.Columns.Count - 3;
            totals.Text = "Totals";
            row.Cells.Add(totals);

            this.InnerTable.Rows.AddAt(0, row);
        }
    }
}

Dans le cas où vous êtes nouveau à ASP.NET comme je suis, je dois aussi souligner que vous avez besoin de:

1) Inscrivez votre classe en ajoutant une ligne comme ceci à votre formulaire web:

<%@ Register TagPrefix="foo" NameSpace="CustomControls" Assembly="__code"%>

2) Changement asp:GridView dans votre précédent balisage toto:TwoHeadedGridView. N'oubliez pas la balise de fermeture.

Une autre édition:

Vous pouvez également le faire sans créer une classe personnalisée.

Simplement ajouter un gestionnaire d'événements pour l'événement DataBound de votre grille comme ceci:

protected void gvOrganisms_DataBound(object sender, EventArgs e)
{
    GridView grid = sender as GridView;

    if (grid != null)
    {
        GridViewRow row = new GridViewRow(0, -1,
            DataControlRowType.Header, DataControlRowState.Normal);

        TableCell left = new TableHeaderCell();
        left.ColumnSpan = 3;
        row.Cells.Add(left);

        TableCell totals = new TableHeaderCell();
        totals.ColumnSpan = grid.Columns.Count - 3;
        totals.Text = "Totals";
        row.Cells.Add(totals);

        Table t = grid.Controls[0] as Table;
        if (t != null)
        {
            t.Rows.AddAt(0, row);
        }
    }
}

L'avantage de la coutume est que vous pouvez voir la ligne d'en-tête supplémentaire sur la vue de la conception de votre formulaire web. La méthode de gestionnaire d'événements est un peu plus simple, mais.

12voto

MaC Points 81

J'ai adopté l'approche de réponse acceptée, mais j'ai ajouté l'en-tête à GridView existant au lieu d'un GridView hérité personnalisé.

Après avoir lié mon GridView, je procède comme suit:

 /*Create header row above generated header row*/

//create row    
GridViewRow row = new GridViewRow(0, -1, DataControlRowType.Header, DataControlRowState.Normal);

//spanned cell that will span the columns I don't want to give the additional header 
TableCell left = new TableHeaderCell();
left.ColumnSpan = 6;
row.Cells.Add(left);

//spanned cell that will span the columns i want to give the additional header
TableCell totals = new TableHeaderCell();
totals.ColumnSpan = myGridView.Columns.Count - 3;
totals.Text = "Additional Header";
row.Cells.Add(totals);

//Add the new row to the gridview as the master header row
//A table is the only Control (index[0]) in a GridView
((Table)myGridView.Controls[0]).Rows.AddAt(0, row);

/*fin*/
 

11voto

Mark Struzinski Points 11288

Cet article devrait vous orienter dans la bonne direction. Vous pouvez créer la ligne par programme et l'ajouter à la collection à la position 0.

2voto

George W Bush Points 13450

texte alternatif

Remarque pour ceux qui choisissent d'utiliser la méthode RowDataBound dans VB.NET

Si vous vous retrouvez avec trop de lignes d'en-tête supplémentaires, ajoutez une instruction If qui n'est exécutée que si la ligne d'en-tête de gridview n'est rien (ce qui signifie que c'est celle qui est actuellement liée).

  If grid.HeaderRow Is Nothing Then
 

1voto

Andrew Bullock Points 14899

Vous devrez créer une classe qui étend gridview puis substitue la méthode CreateRow.

essayez ceci comme point de départ

1voto

daniel Points 11

Mais lorsque vous enregistrez des données et en cas d'erreur sur le serveur, des lignes sont mal alignées.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X