Sorting Modes and Custom Sorting

Dec 23, 2024
4 minutes to read

The GridControl supports data sorting by cell values and display text. For each column, you can specify how their data should be sorted - by the edit or display values, or using custom logic. To specify the required sort mode, use the ColumnBase.SortMode property.

Sorting by Edit Values (Default)Sorts a column’s data by its edit values. To enable this mode, set the ColumnBase.SortMode property to ColumnSortMode.Value. Sorting by Display Text Sorts a column’s data by its display text (the strings displayed within data cells). To enable this mode, set the ColumnBase.SortMode property to ColumnSortMode.DisplayText. Custom Sorting Allows you to implement custom sort rules. To do this, handle the GridControl.CustomColumnSort event or use the GridControl.CustomColumnSortCommand property. To enable this mode, set the ColumnBase.SortMode property to ColumnSortMode.Custom.

Note

Sorting by display text and custom sorting are not supported in Server Mode.

When users modify cell values against which the GridControl is sorted, the grid moves the modified row to a new position according to applied sort options. You can set the DataViewBase.ImmediateUpdateRowPosition property to false to keep row positions until the grid is refreshed.

Sorting by Another Column

The GridControl‘s default sorting and grouping behavior is as follows. On clicking a column header or changing the ColumnBase.SortOrder property, data is sorted by the corresponding field. On grouping against a column, data groups are created based on the values of this column.

The ColumnBase.SortFieldName property allows you to change this behavior. When sorting/grouping is applied to a specific column, you can sort/group data against another field instead. To do this, set the ColumnBase.SortFieldName property to the required field name:

Xaml

xaml

<dx:ThemedWindow
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:dx="http://schemas.devexpress.com/winfx/2008/xaml/core"
    xmlns:dxe="http://schemas.devexpress.com/winfx/2008/xaml/editors"
    xmlns:dxg="http://schemas.devexpress.com/winfx/2008/xaml/grid"
    x:Class="DXApplication23.MainWindow"
    Title="MainWindow" Height="800" Width="1000">
    <Grid>
        <dxg:GridControl Name="gridControl1" AutoGenerateColumns="AddNew" EnableSmartColumnsGeneration="True" Margin="40,50,29,36">
            <dxg:GridControl.View>
                <dxg:TableView AllowHeaderNavigation="True" TotalSummaryPosition="Bottom" AutoWidth="True"/>
            </dxg:GridControl.View>
            <dxg:GridColumn FieldName="OrderId"
                SortFieldName="CreateDate"
                SortOrder="Ascending"/>
            <dxg:GridColumn FieldName="CreateDate"/>
            <dxg:GridColumn FieldName="Price">
                <dxg:GridColumn.EditSettings>
                    <dxe:TextEditSettings Mask="c2" MaskType="Numeric" MaskUseAsDisplayFormat="True"/>
                </dxg:GridColumn.EditSettings>
            </dxg:GridColumn>
        </dxg:GridControl>
    </Grid>
</dx:ThemedWindow>

The screenshot below shows the result:

Custom Sorting

You can create custom rules to sort data. To do this, follow the steps below:

Specify the ColumnBase.SortOrder or GridColumn.GroupIndex property.
Set the ColumnBase.SortMode property to Custom.
Create a command that uses custom rules to sort rows.
Assign the command to the GridControl.CustomColumnSortCommand property.

In the command, you need to compare two rows. The FirstValue and SecondValue parameters identify the values of these rows in the FieldName column. Set the result of the comparison to the Result parameter as follows:

-1 to position the first row above the second row when data is sorted in ascending order. When data is sorted in descending order, the GridControl positions the first row below the second row.
1 to position the first row below the second row when data is sorted in ascending order. When data is sorted in descending order, the GridControl positions the first row above the second row.
0 to indicate that the rows are equal. In this case, the GridControl arranges rows according to their indices in a data source.

Example: How to Sort Rows Based on Custom Logic

The following example uses custom rules to sort data in the GridControl:

View Example: How to Use Custom Rules to Sort Data

XAML

xaml

<dxg:GridControl ItemsSource="{Binding Items}"
                 CustomColumnSortCommand="{Binding CustomColumnSortCommand}">
    <dxg:GridControl.Columns>
        <dxg:GridColumn FieldName="Day" GroupIndex="0" SortMode="Custom" />
        <dxg:GridColumn FieldName="Employee" />
    </dxg:GridControl.Columns>
</dxg:GridControl>

C#
VB.NET

csharp

using DevExpress.Mvvm;
using DevExpress.Mvvm.DataAnnotations;
using DevExpress.Mvvm.Xpf;
// ...
public class MainViewModel : ViewModelBase {
// ...
    [Command]
    public void CustomColumnSort(RowSortArgs args) {
        if(args.FieldName == "Day") {
            int dayIndex1 = GetDayIndex(args.FirstValue);
            int dayIndex2 = GetDayIndex(args.SecondValue);
            args.Result = dayIndex1.CompareTo(dayIndex2);
        }
    }
    int GetDayIndex(object day) {
        return (int)Enum.Parse(typeof(DayOfWeek), (string)day);
    }
}

Imports DevExpress.Mvvm
Imports DevExpress.Mvvm.DataAnnotations
Imports DevExpress.Mvvm.Xpf
' ...
Public Class MainViewModel
    Inherits ViewModelBase
' ...
    <Command>
    Public Sub CustomColumnSort(ByVal args As RowSortArgs)
        If args.FieldName = "Day" Then
            Dim dayIndex1 As Integer = GetDayIndex(args.FirstValue)
            Dim dayIndex2 As Integer = GetDayIndex(args.SecondValue)
            args.Result = dayIndex1.CompareTo(dayIndex2)
        End If
    End Sub
    Private Function GetDayIndex(ByVal day As Object) As Integer
        Return DirectCast(System.Enum.Parse(GetType(DayOfWeek), DirectCast(day, String)), Integer)
    End Function
End Class