ASP.NET GridView 第二个标题行跨越主标题行 [英] ASP.NET GridView second header row to span main header row

问题描述

我有一个 ASP.NET GridView，它的列看起来像这样:

I have an ASP.NET GridView which has columns that look like this:

| Foo | Bar | Total1 | Total2 | Total3 |

是否可以在两行上创建一个像这样的标题?

Is it possible to create a header on two rows that looks like this?

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

每行中的数据将保持不变，因为这只是为了修饰标题并减少网格占用的水平空间.

The data in each row will remain unchanged as this is just to pretty up the header and decrease the horizontal space that the grid takes up.

整个 GridView 是可排序的，以防万一.我不希望添加的总计"跨越列具有任何排序功能.

The entire GridView is sortable in case that matters. I don't intend for the added "Totals" spanning column to have any sort functionality.

基于下面给出的一篇文章，我创建了一个继承自 GridView 的类，并在其中添加了第二个标题行.

Based on one of the articles given below, I created a class which inherits from GridView and adds the second header row in.

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);
        }
    }
}

如果您像我一样不熟悉 ASP.NET，我还应该指出您需要:

In case you are new to ASP.NET like I am, I should also point out that you need to:

1) 通过在您的网络表单中添加如下一行来注册您的课程:

1) Register your class by adding a line like this to your web form:

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

2) 将之前标记中的 asp:GridView 更改为 foo:TwoHeadedGridView.不要忘记结束标记.

2) Change asp:GridView in your previous markup to foo:TwoHeadedGridView. Don't forget the closing tag.

另一个

您也可以在不创建自定义类的情况下执行此操作.

You can also do this without creating a custom class.

只需为网格的 DataBound 事件添加一个事件处理程序，如下所示:

Simply add an event handler for the DataBound event of your grid like this:

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);
        }
    }
}

自定义控件的优点是您可以在 Web 表单的设计视图上看到额外的标题行.不过，事件处理程序方法要简单一些.

The advantage of the custom control is that you can see the extra header row on the design view of your web form. The event handler method is a bit simpler, though.

推荐答案

这篇文章 应该为您指明正确的方向.您可以以编程方式创建该行并将其添加到位置 0 的集合中.

This article should point you in the right direction. You can programmatically create the row and add it to the collection at position 0.

这篇关于ASP.NET GridView 第二个标题行跨越主标题行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！