[Expand]General Information
[Collapse]WinForms Controls
  .NET Core Support
 [Expand]What's Installed
 [Expand]Build an Application
 [Collapse]Controls and Libraries
  [Expand]Forms and User Controls
  [Expand]Messages, Notifications, and Dialogs
  [Expand]Editors and Simple Controls
  [Expand]Ribbon, Bars and Menu
  [Expand]Application UI Manager
  [Expand]Docking Library
  [Collapse]Data Grid
   [Collapse]Get Started With Data Grid and Views
     [Expand]Appearance and Conditional Formatting
     [Expand]Data Editing
     [Expand]Hit Information
     [Expand]Data Binding and Working with Columns
     [Expand]Grid View - Columns, Rows and Cells
     [Expand]Banded Views
     [Expand]WinExplorer View
     [Expand]Tile View
     [Expand]Filter and Search
       Tutorial: Custom Sorting and Non-Sortable Columns
       Tutorial: Data Sorting Basics
       Tutorial: Sorting by Values or Display Text
     [Expand]Split Presentation
     [Expand]Row Preview Sections
   [Expand]Data Binding
    Unbound Columns
   [Expand]Data Editing and Validation
   [Expand]Filter and Search
   [Expand]Focus and Selection Handling
    Format Cell Values
   [Expand]Master-Detail Relationships
   [Expand]Asynchronous Image Load
   [Expand]Export and Printing
   [Expand]Appearance and Conditional Formatting
    Split Presentation
    Row Preview Sections
   [Expand]Batch Modifications
    Hit Information
    Popup Menus
   [Expand]Save and Restore Layout
   [Expand]Visual Elements
   [Expand]Design-Time Features
   [Expand]End-User Capabilities
    Included Components
  [Expand]Vertical Grid
  [Expand]Property Grid
  [Expand]Pivot Grid
  [Expand]Tree List
  [Expand]Gantt Control
  [Expand]Chart Control
  [Expand]Map Control
  [Expand]Rich Text Editor
  [Expand]Spell Checker
  [Expand]Form Layout Managers
  [Expand]Navigation Controls
  [Expand]PDF Viewer
  [Expand]TreeMap Control
  [Expand]Sunburst Control
 [Expand]Common Features
  Get More Help
 [Expand]API Reference
[Expand]ASP.NET Controls and MVC Extensions
[Expand]ASP.NET Bootstrap Controls
[Expand]ASP.NET Core Bootstrap Controls
[Expand]WPF Controls
[Expand]Xamarin Controls
[Expand]Windows 10 App Controls
[Expand]Office File API
[Expand]Report and Dashboard Server
[Expand]eXpressApp Framework
[Expand]eXpress Persistent Objects
[Expand]CodeRush Classic
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation
View this topic on docs.devexpress.com (Learn more)

Tutorial: Sorting by Values or Display Text

This walkthrough is a transcript of the Custom Sorting and Non-Sortable Columns video available on the DevExpress YouTube Channel.

The document shows examples of how sorting data against a column can give you unexpected results if underlying values differ from the text displayed in grid cells. In a similar manner, you will see how a sort order can change for numeric or date-time columns if their values are treated as strings. You will learn how the grid determines when to sort data using cell display text or using actual column values. The tutorial will also show you the property you can use to manually switch from one mode to another.

Expanded Default Behavior

The grid usually sorts data exactly how you expect it to. When you sort against a column containing text data, like Name, it will be sorted in alphabetical order. If you sort numeric or date-time columns, you'll get numbers sorted from smallest to largest or dates from earliest to most recent.

Now take a look at the Priority column that uses a cell editor to transform underlying priority values of 1, 2 and 3 to the corresponding textual descriptions: "Low", "Medium" and "High". When you click the column header, you expect the values to be sorted from Low to High or vice versa. In reality, data is sorted in alphabetical order where "High" is followed by "Low" and only then by "Medium".

Expanded Sorting Columns that Use LookUp and ImageComboBox Editors

Go to design time and fix the sort mode for the Priority column. First, see how the assigned ImageComboBoxEdit in-place editor is set up. Expand the GridColumn.ColumnEdit property and access the editors items collection by clicking the ellipsis button for the RepositoryItemImageComboBox.Items property. Look at the ComboBoxItem.Value and ImageComboBoxItem.Description properties. "Low" corresponds to 1, "Medium" to 2 and "High" to 3. Now you can be sure the grid can properly sort data based on those underlying values.

Access the Priority column's settings and see that its GridColumn.SortMode property is set to ColumnSortMode.Default.

In other words, the grid View automatically determines what kind of sorting to use. For columns with ImageComboBoxEdit or LookUpEdit editors, this means sorting by display text rather than values. It makes sense because these columns usually display names extracted by the ID from another table and you'd rather organize those names alphabetically than by IDs that you won't see. On the other hand, this doesn't work with statuses in which sorting by IDs makes sense, while alphabetical sorting doesn't. So to force sorting by values, switch the GridColumn.SortMode property to ColumnSortMode.Value.

Run the application and click the Priority column header. As a result, these column cells are sorted in ascending order according their edit values of 1, 2 and 3.

Expanded Sorting Columns that Use Other Editor Types

With any other editor types, the grid View sorts values - which is expected behavior. Numbers go from smallest to biggest and dates are arranged from earliest to most recent. If you were to switch from value sorting to display text mode, then 10 or 100 would appear before 2, since 1 is less than 2 and strings are simply compared character by character. To enable this mode, you'll need to manually switch the GridColumn.SortMode property to ColumnSortMode.DisplayText.

To try this in action, sort the Created Date column to ensure that dates are arranged as expected from earliest to most recent. After that, go to the Property grid displaying column settings and change the GridColumn.SortMode property to ColumnSortMode.DisplayText. See how "11" and "12" appear before "2" and notice that the year portion doesn't seem to be taken into account.

Expanded See Also

Is this topic helpful?​​​​​​​