Back to Devexpress

Group List View Data

expressappframework-403248-getting-started-in-depth-tutorial-blazor-customize-data-display-and-view-layout-group-list-view-data.md

latest1.7 KB
Original Source

Group List View Data

  • Feb 20, 2023
  • 2 minutes to read

This lesson explains how to group the Employee List View data by department and position.

Note

Before you proceed, take a moment to review the previous lessons:

Step-by-Step Instructions

  1. Open the Model.DesignedDiffs.xafml file in the Model Editor.

  2. Click the Views | MySolution.Module.BusinessObjects | Employee | Employee_ListView | Columns node to open the Grid List Editor Designer. Right-click the table header and select the Show Group By Box item.

  3. The Group Panel appears above the column headers.

  4. Drag the Department and Position column headers to the Group Panel. Note that multiple columns in the group area create nested groups.

  5. Run the application. The Employee List View displays objects grouped by the Department and Position properties. You can see the Group Panel above the grid:

Note

Users can drag columns to and from the Group Panel to group and ungroup the List View objects. You can hide the Group Panel to prevent users from changing groups. Navigate to the Views | MySolution.Module.BusinessObjects | Employee | Employee_ListView node and set its IsGroupPanelVisible property to False.

Next Lesson

Enable Split Layout in a List View