Kendo Grid custom sort order

I’ve been racking my brains as the sorting on the Kendo Grid is pretty good, only that I need to be able to not sort in the order that is being displayed. ¬†An example would be numbers written out in full and you want them in number sort order.

@(Html.Kendo().Grid<Number>()
 .Name("grid")
 .Columns(columns =>
 {
 columns.Bound(c => c.Id);
 columns.Bound(c => c.Item);
 })
 .Sortable()
 .DataSource(dataSource => dataSource
 .Ajax()
 .Read(read => read.Action("Numbers_Read", "Home"))
 )
)


Here is the list not in any order, but it does have a sortorder column

 private static List<Number> GetNumbers()
 {
 List<Number> numbers = new List<Number>();

 numbers.Add(new Number() { Id = 1, Item = "one", SortOrder = "1" });

 numbers.Add(new Number() { Id = 2, Item = "three", SortOrder = "3" });

 numbers.Add(new Number() { Id = 3, Item = "six", SortOrder = "6" });
 numbers.Add(new Number() { Id = 4, Item = "two", SortOrder = "2" });
 numbers.Add(new Number() { Id = 5, Item = "five", SortOrder = "5" });
 numbers.Add(new Number() { Id = 6, Item = "seven", SortOrder = "7" });
 numbers.Add(new Number() { Id = 7, Item = "four", SortOrder = "4" });
 return numbers;
 }

and now for the magic, when the request is coming back into the controller action we check to see what is being requested and then change it to another hidden column, this way it retains all the functionality of the Kendo Grid and it just works….!

public ActionResult Numbers_Read([DataSourceRequest]DataSourceRequest request)
 {
 List<Number> numbers = GetNumbers();

 foreach (var sort in request.Sorts)
 {
 // Find the sort member you need a custom sort for and change it to the custom column 
 if (sort.Member.ToLowerInvariant() == "item")
 {
 sort.Member = "SortOrder";
 }
 }
 return Json(numbers.ToDataSourceResult(request), JsonRequestBehavior.AllowGet);
 }

I have created this sample Kendo Grid project so you can see how it is all done.

kendo_grid