This is a migrated thread and some comments may be shown as answers.

Groupable grid using MVVM

1 Answer 147 Views

Grid

This is a migrated thread and some comments may be shown as answers.

eduardo asked on 18 Dec 2012, 04:28 PM

Hello.
I just updated to Kendo UI for ASP.NET MVC Q3 2012 and I am trying to create a pageable, filterable, sortable and groupable grid. We are using ASP.NET MVC, but because of the MVVC architecture we are using, the grid properties are being defined using html attributes, like this:

<div id="userGrid"
  data-role="grid"
  data-columns='[{ "field": "Name", "title": "Name"}, { "field": "Group", "title": "Group"}]'
  data-filterable='true'
  data-navigatable='true'
  data-pageable='true'
  data-groupable='true'
  data-sortable='true'
  data-bind="source: userDataSource"></div>

and the DataSource is being set in javascript like this:

userDataSource: new kendo.data.DataSource({
type: "aspnetmvc-ajax",
transport: {
read: {
url: '/home/ListUsers'
}
},
schema: {
model: {
id: 'ID',
fields: {
ID: {
type: 'number'
},
Name: {
type: 'string'
},
Group: {
type: 'string'
}
}
},
data: 'Data',
total: 'Total'
},
page: 1,
pageSize: 30,
serverPaging: true,
serverSorting: true,
serverFiltering: true,
serverAggregates: true,
serverGrouping: true
})

The ListUsers actions simply returns the corresponding data using DataSourceRequest, like this:

public ActionResult ListUsers([DataSourceRequest] DataSourceRequest request)
{
  return Json(GetUsers().ToDataSourceResult(request));
}

By doing this, the grid is shown correctly, the paging, filtering and sorting all work fine, but not the grouping. I can see the column "drop area" and I can drag the column headers, but I can't drop them.
I compared the grid properties with the script generated when using the MVC wrapper (using the wrapper, the grouping works) and I didn't see anything different that could be related to grouping. Am I missing something?

Thanks!

1 Answer, 1 is accepted

Accepted