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

Possible bug in flattenGroups private javascript function in kendo.binder.js

3 Answers 112 Views

MVVM

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

László asked on 17 Jul 2013, 12:25 PM

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:

{

"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

}

The setup of the grid and the viewmodel:

<!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>

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:

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.}

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:

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.}

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?

3 Answers, 1 is accepted

Accepted