EssentialGrid in ASP.NET MVC 2 does not sort column data

[Todd]

I am brand new to all of: ASP.NET, ASP.NET MVC2, and Syncfusion EssentialGrid. I am evaluating Syncfusion EssentialGrid for use in an ASP.NET MVC 2 application. I'm developing using Visual Studio 2010, language C#.

I can populate the grid with test data, no problem. But when I click on a column header cell the data in the grid does not sort. The form disables for a second or so, and a little sort indicator (sort of like ^ or V) appears next to the text of the column header. So the grid control seems to be "trying to sort".

Here is the critical method in my controller class. According to the docs it seems that the "" line is what I need to enable sorting.

// >>>>>>>>>>>>>>>>>>>>

public ActionResult OverviewByServer() {
ViewData["Message"] = "Overview by Server";

// read list
Models.AgentListByProperty al = new Models.AgentListByProperty("Server");
//List allList = al.GetAgentList();
List sumList = al.GetSummaryList();

GridPropertiesModel gridModel =
new GridPropertiesModel() {
DataSource = sumList,
ShowCaption = false,
AutoFormat = Syncfusion.Mvc.Shared.Skins.Vista,
AllowSorting = true
};

ViewData["AgentSummaryByServer"] = gridModel;
ViewData["DefaultSkin"] = Syncfusion.Mvc.Shared.Skins.Vista;
//var data = sumList;
return View();
}
// <<<<<<<<<<<<<

The view in question is:

// >>>>>>>>>>>>>

<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage>" %>


ByApplication

<%: ViewData["Message"] %>

<%=Html.Grid("GridIndex")
.Datasource(Model)
.Column(column =>
{
column.Add(p => p.ByProperty).HeaderText("GroupBy");
column.Add(p => p.AgentsTotal).HeaderText("AgentTotal");
column.Add(p => p.AgentsInCall).HeaderText("InCall");
column.Add(p => p.AgentsReady).HeaderText("Ready");
column.Add(p => p.AgentsLoading).HeaderText("Loading");
column.Add(p => p.AgentsInErrorState).HeaderText("Error");
})
.EnableSorting()

%>

// <<<<<<<<<<<<<


One thing I tried was providing a sort method in the controller but that never gets called.

How do I get in-grid sorting to work? Failing that, how do I get sorting of any kind to work?

[Balaji M]

Hi Todd,

Thank you for evaluating Syncfusion products.

This issue reproduced because of Sorting action method is not added in controller. In order to working with sorting actions create a post method for OverviewByServer action(Grid parent action name is OverViewByServer, hence sorting action name is mapped to "OverviewByServer" with post action) and bind the data source to grid.

[Controller]

///

/// Sorting Request is mapped to this method. This method invokes the HtmlActionResult
/// from the Grid. Required response is generated.
///

/// Contains paging properties
///
/// HtmlActionResult which returns data displayed on the Grid
///
[AcceptVerbs(HttpVerbs.Post)]
public ActionResult OverviewByServer(PagingParams args)
{

IEnumerable data = new NorthwindDataContext().Orders;
return data.GridActions();// here our sample data is binded to GridAction.
}

Essential grid provides two ways to enable this sorting feature.

1. GridBuilder - Set grid properties via view page using GridBuilder
2. GridPropertiesModel - Se the grid properties via GridPropertiesModel and attach this properties to grid using ViewData() method.


Using GridBuilder

The steps to work with the editing feature through GridBuilder are as follows:

1. Create a strongly typed view (Refer Create strongly typed view)

2. In view you can use its Model property in Datasource() in order to bind the data source.

[View]

<%=Html.Grid("Grid1")
.Datasource(Model)
.Caption("Orders")
.AutoFormat(Skins.Sandune)
.Column( columns => {
columns.Add(p => p.OrderID).HeaderText("Order ID");
columns.Add(p => p.CustomerID).HeaderText("Customer ID");
columns.Add(p => p.EmployeeID).HeaderText("Employee ID");
columns.Add(P => P.ShipCountry).HeaderText("Ship Country");
columns.Add(p => p.ShipCity).HeaderText("Ship City");
})
%>

3. To enable the sorting feature for your grid you should use EnableSorting() method.

[View]
<%=Html.Grid("Grid1")
.Datasource(Model)
.Caption("Orders")
.EnableSorting()
.EnablePaging()
.AutoFormat(Skins.Sandune)
.Column( columns => {
columns.Add(p => p.OrderID).HeaderText("Order ID");
columns.Add(p => p.CustomerID).HeaderText("Customer ID");
columns.Add(p => p.EmployeeID).HeaderText("Employee ID");
columns.Add(P => P.ShipCountry).HeaderText("Ship Country");
columns.Add(p => p.ShipCity).HeaderText("Ship City");
})
%>

4. Set its data source and render the view

[controller]
///

/// Used for rendering the grid initially.
///

/// Veiw page, it displays the Grid
public ActionResult Index()
{
var data = new NorthwindDataContext().Orders;
return View(data);
}

5. In order to working with sorting actions create a post method for Index action and bind the data source to grid as like below code.

[controller]
///

/// Sorting Request is mapped to this method. This method invokes the HtmlActionResult
/// from the Grid. Required response is generated.
///

/// Contains paging properties
///
/// HtmlActionResult which returns data displayed on the Grid
///
[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Index(PagingParams args)
{
IEnumerable data = new NorthwindDataContext().Orders;
return data.GridActions();
}

We are currently working on revamping the UG for Grid product. This will be updated by end of this week.

Please let us know if you have any queries.

Regards,
M. Balaji.

[Todd]

Thank you for the advice. Also quite easily got filters working.

[Krishnaraj D]

Hi Todd,

Thanks for the update. Good to hear that you have everything working. Do not hesitate to update this forum if you have any queries.


Regards,
Krishnaraj D