Sort Data

  • 4 minutes to read

ASPxGridView allows you to sort column data.

To allow end users to sort column data, set the AllowSort property to true in the following objects:

The integrated data sorting algorithm only works on types that implement the IComparable interface. If a column's data type does not support this interface, or you wish to change the default sort order, apply a custom sort.

Sort in UI

Click an unsorted column's header to sort the column and clear the sort order for other columns. The sort glyph indicates the column's current sort order. To change the sort order, click the header again.

To sort data in multiple columns, hold the SHIFT key and click the required column headers. To clear the sort order for an individual column, press the CTRL key and click the column header.

The image below illustrates sorted columns in the grid:

  • the Country column's data is sorted in descending order;
  • the City column's data is sorted in ascending order.

cdSortingRuntime

Online Demo: Sorting Data

Sort in Code

Sort a Column

Use any of the following API members to sort a column:

  • Specify a column's GridViewDataColumn.SortOrder property.

    ((GridViewDataColumn)ASPxGridView1.Columns["Department"]).SortOrder = ColumnSortOrder.Ascending;
    
  • Call a column's GridViewDataColumn.SortAscending or GridViewDataColumn.SortDescending method.

    ((GridViewDataColumn)ASPxGridView1.Columns["Department"]).SortAscending();
    
  • Call the server-side ASPxGridView.SortBy method.

    ASPxGridView1.SortBy(ASPxGridView1.Columns["Department"], ColumnSortOrder.Ascending);
    
  • Call the client-side ASPxClientGridView.SortBy method.

    function ProcessSorting(s, e, grid) {
        grid.SortBy(e.column.name);
        ...
    }
    

Clear Sorting

Use any of the following API members to clear the sort order:

  • Set a column's GridViewDataColumn.SortOrder property to None.

    ((GridViewDataColumn)ASPxGridView1.Columns["Department"]).SortOrder= ColumnSortOrder.None;
    
  • Call a column's GridViewDataColumn.UnSort method.

    ((GridViewDataColumn)ASPxGridView1.Columns["Department"]).UnSort();
    
  • Set a column's GridViewDataColumn.SortIndex property to -1.

    ((GridViewDataColumn)ASPxGridView1.Columns["Department"]).SortIndex=-1;
    
  • Call the control's ASPxGridBase.ClearSort method.

    ASPxGridView1.ClearSort();
    
API member Type Description
ASPxClientGridView.ColumnSorting Event Enables you to prevent columns from being sorted.
ASPxGridView.BeforeColumnSortingGrouping Event Enables you to to manage a column before it is sorted or grouped.
ASPxGridView.CustomColumnSort Event Enables you to use custom sorting algorithms.
ASPxGridView.IsAllowSort Method Indicates whether data sorting is allowed.
ASPxGridView.GetSortedColumns Method Returns a collection of sorted columns.
ASPxGridBase.SortCount Property Gets the number of sorted columns.
GridViewDataColumn.SortIndex Property Gets or sets a column's position among sorted columns.
GridViewDataColumn.SortOrder Property Gets or sets the column's sort order.

Custom Sorting

  1. Set the GridDataColumnSettings.SortMode property to Custom.
  2. Handle the ASPxGridView.CustomColumnSort event to apply a custom sorting algorithm to the column.

The example below sorts the Country column by character length in descending order.

<dx:ASPxGridView ID="ASPxGridView1" runat="server"  OnCustomColumnSort="grid_CustomColumnSort">
    <Columns>
        <dx:GridViewDataColumn FieldName="Country" SortOrder="Descending">
                <Settings SortMode="Custom" />
        </dx:GridViewDataColumn>
        ...
    </Columns>
  ...
</dx:ASPxGridView>
protected void grid_CustomColumnSort
(object sender, DevExpress.Web.CustomColumnSortEventArgs e) {
    if (e.Column.FieldName == "Country") {
        e.Handled = true;
        string s1 = e.Value1.ToString(), s2 = e.Value2.ToString();
        if (s1.Length > s2.Length)
            e.Result = 1;
        else
            if (s1.Length == s2.Length)
                e.Result = Comparer.Default.Compare(s1, s2);
            else
                e.Result = -1;
    }
}

Result:

CustomColumnSort

Sort Groups by Summary Values

To sort groups by their summary values, create an instance of the ASPxGroupSummarySortInfo object, customize its settings and add this object to the ASPxGridView.GroupSummarySortInfo collection. Remove this object from the collection to cancel sorting.

The example below sorts rows in groups by their summary values in descending order.

using DevExpress.Data;
using DevExpress.Web;

protected void Page_Load(object sender, EventArgs e)
        {
            grid.GroupSummarySortInfo.Clear();
            ASPxGroupSummarySortInfo sortInfo = new ASPxGroupSummarySortInfo();
            sortInfo.SortOrder = ColumnSortOrder.Descending;
            sortInfo.SummaryItem = grid.GroupSummary["ProductName", SummaryItemType.Count];
            sortInfo.GroupColumn = "CategoryName";
            grid.GroupSummarySortInfo.AddRange(sortInfo);
        }
<dx:ASPxGridView ID="grid" runat="server" AutoGenerateColumns="False" DataSourceID="SqlDataSource1">
    <Columns>
        <dx:GridViewDataTextColumn FieldName="ProductID" VisibleIndex="0"/>
        <dx:GridViewDataTextColumn FieldName="CategoryName" GroupIndex="0" VisibleIndex="1"/>
        <dx:GridViewDataTextColumn FieldName="ProductName" VisibleIndex="2"/>
    </Columns>
    <GroupSummary>
        <dx:ASPxSummaryItem FieldName="ProductName" SummaryType="Count" />
    </GroupSummary>
    </dx:ASPxGridView>

Result:

exGroupSummarySort

Online Demo: Sort by Summaries