Skip to main content
A newer version of this page is available. .

DxGrid.CollapseGroupRow(Int32, Boolean) Method

Collapses a group row with the specified visible index.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v23.1.dll

NuGet Package: DevExpress.Blazor

Declaration

public void CollapseGroupRow(
    int visibleIndex,
    bool recursive = false
)

Parameters

Name Type Description
visibleIndex Int32

The group row’s visible index.

Optional Parameters

Name Type Default Description
recursive Boolean False

Specifies whether to collapse child group rows.

Remarks

The code below implements buttons that allow users to expand and collapse group rows.

@using Microsoft.EntityFrameworkCore
@inject IDbContextFactory<NorthwindContext> NorthwindContextFactory
@implements IDisposable

<DxGrid Data="GridDataSource"
        ShowGroupPanel="true"
        CustomizeCellDisplayText="OnCustomizeCellDisplayText"
        @ref="@MyGrid">
    <Columns>
        <DxGridDataColumn FieldName="OrderDate"
                      DisplayFormat="d"
                      GroupIndex="0"
                      GroupInterval="GridColumnGroupInterval.DateMonth"/>
        <DxGridDataColumn FieldName="Customer"
                      SortMode="GridColumnSortMode.DisplayText"
                      GroupInterval="GridColumnGroupInterval.DisplayText" />
        <DxGridDataColumn FieldName="Freight"
                      DisplayFormat="n2" />
    </Columns>
</DxGrid>

<DxButton Click="@(() => MyGrid.ExpandGroupRow(0))">Expand Group 0</DxButton>
<DxButton Click="@(() => MyGrid.ExpandAllGroupRows())">Expand All Groups</DxButton>

<DxButton Click="@(() => MyGrid.CollapseGroupRow(0))">Collapse Group 0</DxButton>
<DxButton Click="@(() => MyGrid.CollapseAllGroupRows())">Collapse All Groups</DxButton>

@code {
    IGrid MyGrid;
    object GridDataSource { get; set; }
    NorthwindContext Northwind { get; set; }

    protected override void OnInitialized() {
        Northwind = NorthwindContextFactory.CreateDbContext();
        GridDataSource = Northwind.Orders
            .Include(i => i.Customer)
            .Include(i => i.OrderDetails)
            .Include(i => i.ShipViaNavigation)
            .ToList();
    }

    void OnCustomizeCellDisplayText(GridCustomizeCellDisplayTextEventArgs e) {
        if (e.FieldName == "Customer") {
            var customer = (Customer)e.Value;
            e.DisplayText = $"{customer.CompanyName} ({customer.Country}, {customer.City})";
        }
    }

    public void Dispose() {
        Northwind?.Dispose();
    }
}

Expand/Collapse Group Rows

For more information about data grouping in the Grid component, refer to the following topic: Group Data in Blazor Grid.

See Also