How can I add group heading rows to a data bound GridView

I have a GridView with three databound columns, like this:开发者_如何学Python

<Columns>
    <asp:BoundField HeaderText="Type" DataField="Type" />
    <asp:BoundField HeaderText="Amenity" DataField="Amenity" />
    <asp:BoundField HeaderText="Distance" DataField="Distance" DataFormatString="{0:0.00} Km" />
</Columns>

Records are sorted by type, and I want to remove the Type column, but then insert a header row for each type when the value of type for the next set of rows changes. How can I do this?

---

This is not the prettiest, but it solves the problem without going outside of the GridView paradigm. Thanks to carlj for Adding (or Inserting) Subheader Rows into a Gridview

Dim _currentAmenityType = String.Empty
Protected Sub amenitiesGrid_RowDataBound(ByVal sender As Object, ByVal e As GridViewRowEventArgs) Handles amenitiesGrid.RowDataBound
    If (e.Row.RowType = DataControlRowType.DataRow) Then
        Dim drv = e.Row.DataItem
        If (drv("Type") <> _currentAmenityType) Then
            _currentAmenityType = drv("Type")
            Dim parentTable = TryCast(e.Row.Parent, Table)
            If Not parentTable Is Nothing Then
                Dim row = New GridViewRow(-1, -1, DataControlRowType.DataRow, DataControlRowState.Normal)
                Dim cell = New TableCell()
                cell.ColumnSpan = amenitiesGrid.Columns.Count
                cell.Width = Unit.Percentage(100)
                cell.Style.Add("font-weight", "bold")
                cell.Style.Add("background-color", "#c0c0c0")
                cell.Style.Add("color", "white")
                Dim span = New HtmlGenericControl("span")
                span.InnerHtml = _currentAmenityType
                cell.Controls.Add(span)
                row.Cells.Add(cell)
                parentTable.Rows.AddAt(parentTable.Rows.Count - 1, row)
            End If
        End If
    End If
End Sub

---

With the standard GridView control, I believe that you cannot dynamically add extra rows once the control has been databound, so you would need to alter the datasource prior to databinding. However, this probably isn't a very good solution to what you need.

I think that using the GridView control might not be your best option in this situation, as the HTML that is rendered would be

<table>
    <thead>
    <tbody>

So adding extra "header" rows between rows wouldn't actually be Header rows. They would simply be an extra row <tr><td>. Knowing this, I think that you might be better using a Repeater control, building up the HTML for the table within the control, and then have a Placeholder within the Content Template which you can use to mimic adding a new Row.

e.g.

<table>

<asp:Repeater ID="rpt1" runat="server">

    <HeaderTemplate>

        <thead>
            <tr>
                <th>&nbsp;</th>
                <th>Amenity</th>
                <th>Distance</th>
            </tr>
        </thead>
        <tbody>
    </HeaderTemplate>

    <ItemTemplate>

            <asp:PlaceHolder id="phRow" runat="server" />
            <tr>
                <td>&nbsp;</td>
                <td>Amenity Value</td>
                <td>Distance Value</td>
            </tr>            

    </ItemTemplate>

    <FooterTemplate>
          </tbody>
    </FooterTemplate>

</asp:Repeater>

</table>

In your code, loop through each Item in the Repeater. If the Type is different, then add a Literal to the Placeholder in that Row.

Literal lt = new Literal() { Text = "<tr><td colspan='3'>Type Value</td></tr>" };