Skip to main content
TeeGrid supports sorting data by column headers with visual indicators for sort direction.

Basic Sorting Setup

Enable sortable headers:
This enables built-in sorting for simple data sources. For custom sorting logic, use a TSortableHeader render.

Custom Sorting with TSortableHeader

For full control over sorting behavior, create a custom sortable header:

Sorting Events

OnCanSort

Control which columns can be sorted:

OnSortBy

Implement the actual sorting logic:

OnSortState

Provide visual feedback for the current sort state:

TSortState Values

The sort state determines the visual indicator:
  • TSortState.None - No sort indicator
  • TSortState.Ascending - Up arrow (△)
  • TSortState.Descending - Down arrow (▽)

Implementing Sort Logic

For array-based data, use TArray.Sort with a custom comparer:

Sorting Sub-Columns

Handle sorting for columns with sub-columns:

Database Sorting

For database-backed grids, update the query:

Customizing Sort Indicators

Customize the sort indicator appearance:

Multi-Column Sorting

For advanced scenarios, implement multi-column sorting by maintaining a list of sort columns:

Best Practices

  • Use OnCanSort to disable sorting on columns where it doesn’t make sense (actions, images, etc.)
  • Provide visual feedback with OnSortState so users know the current sort order
  • For large datasets, consider database-level sorting instead of in-memory sorting
  • Cache sort column and direction in form fields for persistence
  • Use CompareText for case-insensitive string sorting
  • Use CompareValue from System.Math for numeric comparisons