I'm not sure what is the best way for my scenario, so I'll explain that first.
I have two datasources. Persons and Groups, each Person-Item has an indicator, to which group it belongs to. The persons are binded to a kendo-grid and the groups to a <ul>. My problem is, that I want to display a count-number besides the group, which indicates how many persons are in that group - this information is calculated from the persons-datasource and not part of the group itself.
Sorry for that generic question - but I'm really struggling with this...
I have two datasources. Persons and Groups, each Person-Item has an indicator, to which group it belongs to. The persons are binded to a kendo-grid and the groups to a <ul>. My problem is, that I want to display a count-number besides the group, which indicates how many persons are in that group - this information is calculated from the persons-datasource and not part of the group itself.
Sorry for that generic question - but I'm really struggling with this...
01.
var
contactGroupsDataSource =
new
kendo.data.DataSource({
02.
transport: {
03.
read: {
04.
url:
"api/contactgroups"
05.
}
06.
}
07.
});
08.
09.
$(
'#contactGroupsList'
).kendoListView({
10.
dataSource: contactGroupsDataSource,
11.
template:
"<li class='contactGroupListItem' data-number='${Number}'>${Number} ${Name} (<span data-bind="
text: cgcount[1]
"></span>) </li>"
12.
});
13.
14.
viewModel = kendo.observable({
15.
contactsDataSource:
new
kendo.data.DataSource({
16.
transport: {
17.
read: {
18.
url:
"api/contacts"
19.
}
20.
},
21.
schema: {
22.
model: {
23.
id:
"Id"
,
24.
fields: {
25.
id: { type:
"string"
},
26.
FirstName: { type:
"string"
},
27.
LastName: { type:
"string"
},
28.
ContactGroupNumber: { type:
"integer"
}
29.
}
30.
}
31.
},
32.
change:
function
(e) {
33.
var
data =
this
.data();
34.
35.
for
(
var
i = 0; i < data.length; i++) {
36.
var
cg = data[i][
"ContactGroupNumber"
];
37.
viewModel.cgcount.splice([cg - 1], 1, viewModel.cgcount[cg - 1] + 1);
38.
}
39.
40.
for
(
var
i = 0; i < 7; i++) {
41.
console.log(i + 1 +
': '
+ viewModel.cgcount[i]);
42.
}
43.
}
44.
}),
45.
cgcount:
new
kendo.data.ObservableArray([0, 0, 0, 0, 0, 0, 0])
46.
});
47.
48.
kendo.bind($(
"#contactsGroupContainer"
), viewModel);
49.
50.
contactsListView = $(
'#contactsList'
).kendoGrid({
51.
dataSource: viewModel.contactsDataSource,
52.
sortable:
true
,
53.
rowTemplate: kendo.template($(
"#rowTemplate"
).html())
54.
});