I have a problem with KendoUI Grid when I group and sort - items are not sorted properly. Here is a demo: http://jsfiddle.net/7Dbkz/1/
If I use IE everything works as expected, but it doesn't work in Chrome. I have been told there is an issue with Chrome when it comes to Array.sort implementation (http://code.google.com/p/v8/issues/detail?id=90). Is there a workaround for this issue? If there isn't a solution, grouping is useless in Chrome.
Thanks,
Igor
13 Answers, 1 is accepted
As we already reply to your question, the described behavior is caused by the fact that Chrome Array.sort implementation is not stable. Unfortunately, implementing custom sort is not an option as it will be way too slow compared to the browser's implementation. In order to workaround this you may consider enabling paging and use max page size of 10, as in this case the sort method seems to be stable. Here is an updated version of the test jsFiddle page.
Rosen
the Telerik team
thanks for replaying to my support ticket but I was hoping that someone from community would know how to solve this problem.
Setting page size to 10 is not an option because I am using grouping and sorting for large amount of data. It seems that grouping is useless in Chrome.
Thanks anyway.
Igor
I've setup my project to do server sorting and even though the data is coming back sorted correctly the grid is re-sorting it incorrectly in chrome. Is there any way I can just have it not re-sort? I see there is a serverGrouping option on the grid but can't find what that means or how I would use it. Using a pageSize < 10 is not an option for me. Is there any other way I can get this working in Chrome?
Just in case it helps, here's my current DataSource setup:
dataSource: {
transport: transport
, schema: { model: schema, data: "results", total: "totalItems" }
, pageSize: 20
, serverPaging: true
, serverFiltering: true
, serverSorting: true
, serverAggregates: true
, group: groups
, aggregate: aggregates
},
Thanks,
Matt
The grouping should work as expected in Chrome with the official Q1 2012 KendoUI release as we have added a workaround for the stable sort issue.
However, as you are using server paging, sorting etc. you should handle the grouping also on the server in order to get correct results. Note that in this case you will need to specify where the grouped data is located within the response. This should be done through DataSource schema groups setting. The grouped data returned from the server should be in the following format:
[{
"field"
:
"FirstName"
,
// field by which data records are grouped
"value"
:
"Andrew"
,
// value of the groupby field
"items"
: [
/*data records or nested groups goes here*/
],
"hasSubgroups"
:
false
,
// true if there are nested groups
"aggregates"
:{}
},
{
"field"
:
"FirstName"
,
"value"
:
"Scott"
,
"items"
: [
/*data records or nested groups goes here*/
],
"hasSubgroups"
:
false
,
"aggregates"
:{}
},
/*...*/
]
Greetings,
Rosen
the Telerik team
Thanks for the response but now I can't seem to get the server grouping right. When I turn that on I always get an empty grid.
My DataSource definition looks like this:
var
dataSource =
new
kendo.data.DataSource({
transport: transport,
schema: { model: schema, total:
"totalItems"
, group:
"groups"
, data:
"results"
},
pageSize: 20,
serverPaging:
true
,
serverFiltering:
true
,
serverSorting:
true
,
serverAggregates:
true
,
serverGrouping:
true
,
group: groups,
aggregate: aggregates
});
and my transport returns this:
{
"results"
: [
{
"TestContacts_ID"
:
"27"
,
"TestContacts_CompanyName"
:
"MC 1"
},
{
"TestContacts_ID"
:
"26"
,
"TestContacts_CompanyName"
:
"MC 1"
},
{
"TestContacts_ID"
:
"25"
,
"TestContacts_CompanyName"
:
"MC 1"
},
{
"TestContacts_ID"
:
"29"
,
"TestContacts_CompanyName"
:
"MC 2"
},
{
"TestContacts_ID"
:
"28"
,
"TestContacts_CompanyName"
:
"MC 2"
}
],
"totalItems"
: 5,
"groups"
: [
{
"aggregates"
: {},
"field"
:
"TestContacts_CompanyName"
,
"value"
:
"MC 1"
,
"items"
: [
{
"TestContacts_ID"
:
"27"
,
"TestContacts_CompanyName"
:
"MC 1"
},
{
"TestContacts_ID"
:
"26"
,
"TestContacts_CompanyName"
:
"MC 1"
},
{
"TestContacts_ID"
:
"25"
,
"TestContacts_CompanyName"
:
"MC 1"
}
],
"hasSubgroups"
:
false
},
{
"aggregates"
: {},
"field"
:
"TestContacts_CompanyName"
,
"value"
:
"MC 2"
,
"items"
: [
{
"TestContacts_ID"
:
"29"
,
"TestContacts_CompanyName"
:
"MC 2"
},
{
"TestContacts_ID"
:
"28"
,
"TestContacts_CompanyName"
:
"MC 2"
}
],
"hasSubgroups"
:
false
}
]
}
Does anything look wrong there? Also, how would this data need to look if I did have subgroups?
Thanks,
Matt
I suspect that the grid is not filled in with data as the schema setting is groups not group. Could you please change it and see it this makes any difference.
Regarding the nested groups format. In this case the items field should contain the nested group items (in the same format as described before) and have the hasSubgroups field set to true.
Rosen
the Telerik team
Uncaught ReferenceError: TestContacts_FirstName is not defined
Looks like this is a remnant of a previous test that was coming across in my model for the schema. Fixing the model and using the groups property seems to have done the trick.
Just for future reference my schema now looks like this with serverGrouping on:
schema: { model: schema, groups:
"groups"
, data:
"results"
, total:
"totalItems"
},
Thanks!
Matt
The sort is broken only on the very first grouping when running in Chrome. IE works fine.
Did anyone find a work around for this in Chrome browsers?
Thanks!
This issue has been fixed long ago. Can you provide some code which shows how to reproduce it? Does in happen in the kendo ui online demos?
Kind regards,Atanas Korchev
the Telerik team
Thanks for the response. Here I tried to mimic what I'm doing without all the web service calls. It shows similar behavior.
http://jsfiddle.net/atx6K/
Please note that I copied the kendo resource from another jsfiddle example that looks to be an old version (http://cdn.kendostatic.com/2011.3.1407/js/kendo.all.min.js)
Please let me know what the correct current link should be but rest assured I am using the latest Q1 release in my project.
Thanks!
Nathan
I have looked at the sample you have provided and it works as expected - the groups are sorted as expected. However, note that there is no guarantee that the items in the groups will be in the same order as they appear in the original data set. If you want to persist a specific order you should explicitly set a sort descriptor on the field which they should be ordered by.
All the best,Rosen
the Telerik team
Thanks again,
Nathan