Skip to main content

Traversing Rows

  • 3 minutes to read

This topic describes how to traverse through (access one by one) rows displayed within the GridView. The topic consists of the following sections.

Row Customization

The GridView extension provides two server-side events that fire for each row (data row, group row, etc.) before it is rendered onscreen, and enable you to customize its style and templates, or perform required calculations.

  • GridViewSettings.HtmlRowCreated - This event is raised for each row, displayed within the current page, when the corresponding HTML table row is created. You can handle this event, for example, to initialize web controls contained within grid templates.
  • GridViewSettings.HtmlRowPrepared - This event is raised for each row, displayed within the current page, when the corresponding HTML table row has been prepared, but has not yet been rendered. You can handle this event to change the style settings of individual rows.

Both events provide the same set of parameters, allowing you to identify the currently processed row’s type, visible index, key value, etc.

Note

Important:

When GridView is being rendered, data binding is not allowed. Thus, if you need to obtain the processed row’s values when handling these events, refrain from using methods provided by GridView (e.g., ASPxGridView.GetRow (via MVCxGridView.GetRow), ASPxGridView.GetRowValues (via MVCxGridView.GetRowValues), ASPxGridView.GetCurrentPageRowValues (via MVCxGridView.GetCurrentPageRowValues), etc.). Instead, use the ASPxGridViewTableRowEventArgs.GetValue method provided by the event parameter. To obtain the values of other rows (not currently being processed), use the methods provided by the data model.

The code sample below demonstrates how to change the style of a row based on one of its values.

View code:

@Html.DevExpress().GridView(settings => {
    settings.Name = "GridView";
    settings.CallbackRouteValues = new { Controller = "Home", Action = "GridViewPartial" };
    settings.KeyFieldName = "ProductID";
    settings.Columns.Add("ProductName");
    // ...

    // Discontinued items are displayed in gray font.
    settings.HtmlRowPrepared = (s, e) => {
        if (Convert.ToBoolean(e.GetValue("Discontinued")) == true) {
            e.Row.ForeColor = System.Drawing.Color.DarkGray;
        }
    };
}).Bind(Model).GetHtml()

The image below illustrates the result.

MVC_Grid_Rows_HtmlRowPrepared

Rows Displayed within the Current Page

On the Server Side

GridView provides the ASPxGridView.GetCurrentPageRowValues (via MVCxGridView.GetCurrentPageRowValues) method, which returns row values displayed within the current page. The method’s parameter allows you to specify data source fields whose values should be returned.

The code sample below demonstrates how to get a list of values displayed within the visible rows.

View code:

@Html.DevExpress().GridView(settings => {
    settings.Name = "GridView";
    settings.CallbackRouteValues = new { Controller = "Home", Action = "GridViewPartial" };
    settings.KeyFieldName = "ProductID";
    settings.Columns.Add("ProductName");
    settings.Columns.Add("UnitPrice").PropertiesEdit.DisplayFormatString="c";
    settings.Columns.Add("UnitsInStock");
    settings.Columns.Add("Discontinued", MVCxGridViewColumnType.CheckBox);

    settings.PreRender = (s, e) => {
        var sender = s as MVCxGridView;
        // A list of "ProductName" field values displayed within the current page. 
        var rowValues = sender.GetCurrentPageRowValues("ProductName");
        // Perform the required actions on the processed values. 
        // ... 
    };
}).Bind(Model).GetHtml()

The image below illustrates the format of the returned values.

MVC_Grid_Rows_RowValues

On the Client Side

On the client side, you can use the ASPxClientGridView.GetPageRowValues method as an alternative to the server MVCxGridView.GetCurrentPageRowValues method.

Online Example

View Example: Reorder grid rows using buttons and drag-and-drop