Data Rows

  • 4 minutes to read

Data Rows are used to display and edit data. The VerticalGrid supports both bound and unbound data rows.

  • Bound data rows represent fields in the VerticalGrid's data source (Data Model). Each row's VerticalGridDataRow.FieldName (through MVCxVerticalGridRow.FieldName) property refers to a valid field in a data source.
  • Unbound rows are not bound to any field in a data source. These rows must be populated manually. For information, see the Unbound Rows topic.

There are fifteen types of data rows. You can define the row type using the MVCxVerticalGridRow.RowType property, which receives one of the MVCxVerticalGridRowType enumeration values. The table below lists the VerticalGrid row types, and the default editors used to edit and display values in these row types.

Enum Field Description Values are Edited with Values are Displayed with
MVCxVerticalGridRowType.BinaryImage Indicates that a binary image editor is used to display column values. Values are read-only BinaryImage
MVCxVerticalGridRowType.ButtonEdit Indicates that a button editor is used to edit row values. ButtonEdit Plain text
MVCxVerticalGridRowType.CheckBox Indicates that a check box is used to edit and display row values. CheckBox CheckBox
MVCxVerticalGridRowType.ColorEdit Indicates that a color editor is used to edit row values. ColorEdit Color Indicator with plain text
MVCxVerticalGridRowType.ComboBox Indicates that a combo box is used to edit row values. ComboBox Plain text
MVCxVerticalGridRowType.DateEdit Indicates that a date editor is used to edit row values. DateEdit Plain text
MVCxVerticalGridRowType.DropDownEdit Indicates that a drop down editor is used to edit row values. DropDownEdit Plain text
MVCxVerticalGridRowType.HyperLink Indicates that a hyperlink editor is used to display row values. TextBox HyperLink
MVCxVerticalGridRowType.Image Indicates that an image editor is used to display column values. Values are read-only Image
MVCxVerticalGridRowType.Memo Indicates that a memo editor is used to edit row values. Memo Plain text
MVCxVerticalGridRowType.ProgressBar Indicates that a progress bar is used to visualize row values. SpinEdit ProgressBar
MVCxVerticalGridRowType.SpinEdit Indicates that a spin editor is used to edit row values. SpinEdit Plain text
MVCxVerticalGridRowType.TextBox Indicates that a text box is used to edit row values. TextBox Plain text
MVCxVerticalGridRowType.TimeEdit Indicates that a time editor is used to edit row values. TimeEdit Plain text
MVCxVerticalGridRowType.TokenBox Indicates that a token box is used to edit row values. TokenBox Plain text

On the client, data rows are represented by ASPxClientVerticalGridRow objects.


Since different types of data rows present different types of data, they provide their own editors. For example, Boolean values are edited using a check box editor, while DateTime values are edited using a DateTime editor. To access and customize row editor settings, use the VerticalGridEditDataRow.PropertiesEdit (through MVCxVerticalGridRow.PropertiesEdit) property.

Data rows provide a set of Boolean properties that enable you to specify which elements of a row's functionality (sorting, filtering, etc.) are available to end-users. These options can be accessed using the VerticalGridDataRow.Settings (through MVCxVerticalGridRow.Settings) property.

To make a row read-only, set its VerticalGridDataRow.ReadOnly property to true.

The code sample below demonstrates how to add a read-only data row, change row settings, and change the built-in data editor settings.

@Html.DevExpress().VerticalGrid(settings => {
    settings.Name = "VerticalGrid";
    settings.CallbackRouteValues = new { Controller = "Home", Action = "VerticalGridPartial" };
    // ...
    // Add a read-only data row.
    settings.Rows.Add("FullName").ReadOnly = true;
    // Add a data row bound to the "Quantity" field.
    settings.Rows.Add(r =>
        // Define row settings.
        // Define the name of the field to which the row is bound.
        r.FieldName = "Quantity";
        // End-users will be able to edit row values using the SpinEdit extension.
        r.RowType = MVCxVerticalGridRowType.SpinEdit;
        // Define SpinEdit settings.
        var spinSettings = (SpinEditProperties)r.PropertiesEdit;
        spinSettings.LargeIncrement = 10;
        spinSettings.SpinButtons.ShowLargeIncrementButtons = true;
    // ...


The row's visibility is specified by its WebColumnBase.Visible property. Its position among other visible rows is specified by its WebColumnBase.VisibleIndex property.