How to Expand and Collapse Groups

  • 2 minutes to read

ASPxCardView provides group buttons that allow end users to expand or collapse groups. The IsGroupRowExpanded method identifies whether the group row is expanded or collapsed.

ASPxCardView-Grouping-ExpandCollapseButtons

Expand Group Row

Use the following APIs to expand a group row.

API Member

Description

ASPxCardViewBehaviorSettings.AutoExpandAllGroups

Specifies whether the card view automatically expands all group rows.

ASPxCardView.ExpandGroupRow (server side)

ASPxClientCardView.ExpandGroupRow (client side)

Expands the specified group row.

ASPxCardView.ExpandAll (server side)

ASPxClientCardView.ExpandAll (client side)

Expands all group rows.

ASPxClientCardView.GroupRowExpanding

The card view raises this event before the group row is expanded.

Collapse Group Rows

Use the following APIs to expand the group row.

API Member

Description

ASPxCardView.CollapseGroupRow (server side)

ASPxClientCardView.CollapseGroupRow (client side)

Collapses the specified group row.

ASPxCardView.CollapseAll (server side)

ASPxClientCardView.CollapseAll (client side)

Collapses all group rows.

ASPxClientCardView.GroupRowCollapsing

The card view raises this event before the group row is collapsed.

Examples

  • The following example illustrates how to expand and collapse ASPxCardView groups.

    protected void ASPxButton1_Click(object sender, EventArgs e) {
        cardView.ExpandGroupRow(1);
        cardView.ExpandGroupRow(2);
    }
    
  • The following example illustrates how to expand a group by clicking it.

    if (cardView.IsGroupRow(e.visibleIndex)) {
        if (cardView.IsGroupRowExpanded(e.visibleIndex))
            cardView.CollapseGroupRow(e.visibleIndex);
        else
            cardView.ExpandGroupRow(e.visibleIndex);
    }