Sorting
By default, the sorting functionality of the Telerik UI Grid for ASP.NET MVC is disabled.
Getting Started
To control the sorting in the Grid, use the Sortable option. As a result, the default single-column sorting functionality will be applied.
@(Html.Kendo().Grid<Kendo.Mvc.Examples.Models.OrderViewModel>()
.Name("Grid")
.Sortable()
...
)
Only columns that are bound to a field can be sortable. To enable sorting on a column bound to an object, bind the column to a field of that object.
Sort Modes
The Grid supports the following sort modes:
Single-Column Sorting
By default, the Grid applies single-column sorting when the Sortable() method is enabled. Alternatively, you can configure single-column sort mode by setting the SortMode.
@(Html.Kendo().Grid<Kendo.Mvc.Examples.Models.OrderViewModel>()
.Name("Grid")
.Sortable(sortable => sortable
.SortMode(GridSortMode.SingleColumn))
...
)
Multi-Column Sorting
To allow the multi-column sorting, set the SortMode() method to MultipleColumn.
@(Html.Kendo().Grid<Kendo.Mvc.Examples.Models.OrderViewModel>()
.Name("Grid")
.Sortable(sortable => sortable
.SortMode(GridSortMode.MultipleColumn))
...
)
You can also specify if the columns can be unsorted by setting the AllowUnsort property to true or false. For a runnable example, refer to the demo on sorting in the Grid.
With the multi-column sorting you can configure the Grid to display the sort indexes in the header by enabling the ShowIndexes property.
@(Html.Kendo().Grid<Kendo.Mvc.Examples.Models.OrderViewModel>()
.Name("Grid")
.Sortable(sortable => sortable
.AllowUnsort(true)
.SortMode(GridSortMode.MultipleColumn)
.ShowIndexes(true))
...
)
Mixed-Column Sorting
The mixed sorting allows you to single-sort columns by clicking their header and multi-sort columns by holding the CTRL key and clicking the columns header. A single-click (without holding the CTRL key) on any column un-sorts the currently sorted columns and applies single-sorting to the clicked column.
To enable the mixed-column sorting, set the SortMode() option to Mixed.
@(Html.Kendo().Grid<Kendo.Mvc.Examples.Models.OrderViewModel>()
.Name("Grid")
.Sortable(sortable => sortable
.SortMode(GridSortMode.Mixed))
...
)
Defining Field Type
If you want to sort a column as a different type than the original one in the database (for example, decimal<->string and vice versa), you can use the following approach:
@(Html.Kendo().Grid<Kendo.Mvc.Examples.Models.OrderViewModel>()
.Name("Grid")
.Sortable()
...
.DataSource(dataSource => dataSource
.Ajax()
.Model(m =>
{
m.Id("OrderID");
m.Field("Freight", typeof(string));
})
.ServerOperation(false)
.PageSize(20)
.Read(read => read.Action("Orders_Read", "Grid"))
)
)