Hi,
I've just downloaded the new version (2013.2 716) of Kendo UI (also the same problem in 2013.1.514). I created a webservice which returns the desired json for a server groupable grid datasource. The result of the webservice:
The setup of the grid and the viewmodel:
When I try to use the grouping feature i got a javascript error:
Uncaught TypeError: Object [object Object] has no method 'get'
I debugged it and I found that the problem is caused by the binding of the checkbox click event (if I remove the checkbox column everything works fine).
There is a function in kendo.binder.js:
I think the code in line number 8 is not working well, if the data[idx].items is an ObservableArray (the concat adds the observable array as a single element to the result array). I found another implementation of flattenGroups in kendo.data.js:
By changing the flattenGroups in kendo.binder.js to the version of kendo.data.js, the problem resolved.
Is it a bug (the missing "slice()" from kendo.binder.js flattenGroups function), or am I missing something from my code?
I've just downloaded the new version (2013.2 716) of Kendo UI (also the same problem in 2013.1.514). I created a webservice which returns the desired json for a server groupable grid datasource. The result of the webservice:
{
"d"
: {
"Data"
:
null
,
"Groups"
: [
{
"aggregates"
: [],
"field"
:
"Comment"
,
"value"
:
"abc"
,
"hasSubgroups"
:
false
,
"items"
: [
{
"Id"
: 2,
"Comment"
:
"abc"
},
{
"Id"
: 6,
"Comment"
:
"abc"
}
]
},
{
"aggregates"
: [],
"field"
:
"Comment"
,
"value"
:
null
,
"hasSubgroups"
:
false
,
"items"
: [
{
"Id"
: 110,
"Comment"
:
null
}
]
}
],
"Total"
: 3
}
}
<!DOCTYPE html>
<
html
>
<
head
>
<
title
></
title
>
<
link
rel
=
"stylesheet"
href
=
"http://cdn.kendostatic.com/2013.2.716/styles/kendo.common.min.css"
>
<
link
rel
=
"stylesheet"
href
=
"http://cdn.kendostatic.com/2013.2.716/styles/kendo.default.min.css"
>
<
script
src
=
"http://cdn.kendostatic.com/2013.2.716/js/jquery.min.js"
></
script
>
<
script
src
=
"http://cdn.kendostatic.com/2013.2.716/js/kendo.web.min.js"
></
script
>
</
head
>
<
body
>
<
script
>
var viewModel = kendo.observable({
dataSource: new kendo.data.DataSource({
transport: {
read: {
url: "MyService.asmx/GetData",
dataType: "json",
contentType: "application/json; charset=utf-8",
type: "POST"
},
parameterMap: function (data, type)
{
return kendo.stringify({
take: data.take,
skip: data.skip,
sort: data.sort || [],
group: data.group || [],
filter: data.filter || null
});
}
},
schema: {
data: "d.Data",
total: "d.Total",
groups: "d.Groups",
model: {
fields: {
Id: { type: 'number' },
Comment: { type: 'string' }
}
}
},
pageSize: 100,
serverPaging: true,
serverFiltering: true,
serverSorting: true,
serverGrouping: true
}),
onItemSelected: function (e)
{
alert('checkbox clicked');
}
});
$(document).ready(function ()
{
kendo.bind(document.body, viewModel);
});
</
script
>
<
div
data-bind
=
"source: dataSource"
data-role
=
"grid"
data-groupable
=
"true"
data-pageable
=
"false"
data-columns="[{ template: '<input type=\'checkbox\' data-bind=\'events: {click:onItemSelected}\'/>'},{ title:'ID', field: 'Id' },{ title: 'Comment', field: 'Comment' }]">
</
div
>
</
body
>
</
html
>
Uncaught TypeError: Object [object Object] has no method 'get'
I debugged it and I found that the problem is caused by the binding of the checkbox click event (if I remove the checkbox column everything works fine).
There is a function in kendo.binder.js:
01.
function
flattenGroups(data) {
02.
var
idx, length, result = [];
03.
04.
for
(idx = 0, length = data.length; idx < length; idx++) {
05.
if
(data[idx].hasSubgroups) {
06.
result = result.concat(flattenGroups(data[idx].items));
07.
}
else
{
08.
result = result.concat(data[idx].items);
09.
}
10.
}
11.
return
result;
12.
}
01.
function
flattenGroups(data) {
02.
var
idx, length, result = [];
03.
04.
for
(idx = 0, length = data.length; idx < length; idx++) {
05.
if
(data[idx].hasSubgroups) {
06.
result = result.concat(flattenGroups(data[idx].items));
07.
}
else
{
08.
result = result.concat(data[idx].items.slice());
09.
}
10.
}
11.
return
result;
12.
}
Is it a bug (the missing "slice()" from kendo.binder.js flattenGroups function), or am I missing something from my code?