Category Rows

• Aug 01, 2019
• 2 minutes to read

The ASP.NET MVC VerticalGrid provides the capability to organize grid rows in logical groups (categories).

Category Row Type

Each category is implemented as a specific row type - MVCxVerticalGridCategoryRow.

A category row is a different kind of row - it is not designed to display data values directly (it does not support data operations such as sorting, grouping, etc.), but to contain other rows as children within its MVCxVerticalGridCategoryRow.Rows collection. It is possible to have a hierarchy of nested categories by placing another category row into a category row’s MVCxVerticalGridCategoryRow.Rows collection. Note that you can store a data row and a category row at the same hierarchy level (i.e., within the same Rows collection).

The code sample below demonstrates how to use category rows to create a hierarchical grid layout.

C#

@Html.DevExpress().VerticalGrid(
    settings => {
        settings.Name = "VerticalGrid";
        settings.CallbackRouteValues = new { Controller = "Home", Action = "VerticalGridPartial" };

        settings.Rows.Add("SalesPerson");
        settings.Rows.AddCategory(orderCategory => {
            orderCategory.Caption = "Order";
            orderCategory.Rows.AddCategory(companyCategory => {
                companyCategory.Caption = "Company";
                companyCategory.Rows.Add("CompanyName", "Name");
                companyCategory.Rows.Add("Country");
                companyCategory.Rows.Add("Region");
            });
            orderCategory.Rows.Add("OrderDate", "Date").PropertiesEdit.DisplayFormatString = "d";
            orderCategory.Rows.AddCategory(productCategory => {
                productCategory.Caption = "Product";
                productCategory.Rows.Add("ProductName", "Name");
                productCategory.Rows.Add("UnitPrice").PropertiesEdit.DisplayFormatString = "c";
            });
            orderCategory.Rows.Add("Quantity", "Qty");
        });
    }).Bind(Model).GetHtml()

Accessing Rows in a Hierarchical Layout

Defining categories within a VerticalGrid means having a hierarchical row structure. In this case, the VerticalGrid’s VerticalGridSettings.Rows property only provides access to root level rows. To make it easier to traverse through all rows, the VerticalGrid introduces a specific ASPxVerticalGrid.AllRows (through MVCxVerticalGrid.AllRows) property. It provides access to a read-only collection containing all grid rows.