or
<!-- Gemeinden Steuerfüsse-->
<
div
data-role
=
"view"
id
=
"view-gemeinden-steuerfuesse"
data-init
=
"getGemeindeDaten('SteuerfussTotal')"
data-layout
=
"drawer-layout-gemeinden"
data-title
=
"Steuerfüsse"
>
<
div
data-role
=
"content"
class
=
"view-content"
>
<
div
id
=
"grid-gemeinden-steuerfuesse"
></
div
>
</
div
>
</
div
>
<!-- Gemeinden Einwohner-->
<
div
data-role
=
"view"
id
=
"view-gemeinden-einwohner"
data-init
=
"getGemeindeDaten('Einwohner')"
data-layout
=
"drawer-layout-gemeinden"
data-title
=
"Einwohnerzahlen"
>
<
div
data-role
=
"content"
class
=
"view-content"
>
<
div
id
=
"grid-gemeinden-einwohner"
></
div
>
</
div
>
</
div
>
<!-- Gemeinden Ausländeranetiel-->
<
div
data-role
=
"view"
id
=
"view-gemeinden-auslaender"
data-init
=
"getGemeindeDaten('Auslaenderanteil')"
data-layout
=
"drawer-layout-gemeinden"
data-title
=
"Ausländeranteil"
>
<
div
data-role
=
"content"
class
=
"view-content"
>
<
div
id
=
"grid-gemeinden-auslaender"
></
div
>
</
div
>
</
div
>
function
getGemeindeDaten(sortBy) {
var
dataSource =
new
kendo.data.DataSource({
type:
"json"
,
transport: {
read: {
data:{
Accept:
"application/json"
}
}
},
sort: {field: sortBy, dir:
"asc"
},
});
$(
"#grid-gemeinden-steuerfuesse"
).kendoGrid({
dataSource: dataSource,
sortable:
true
,
columns: [
{
field:
"Gemeinde"
,
title:
"Gemeinde"
,
width: 150,
attributes: {
style:
"text-align: left; font-size: 0.8em; "
},
headerAttributes: {
style:
"text-align: left; font-size: 1em; "
}
}, {
field:
"SteuerfussJahr"
,
title:
" Jahr"
,
width: 90,
attributes: {
style:
"text-align: left; font-size: 0.8em; "
},
headerAttributes: {
style:
"text-align: left; font-size: 1em; "
}
}, {
field:
"SteuerfussTotal"
,
title:
"Total"
,
width: 90
}
, {
template:
"<a href='http://www.web.statistik.zh.ch/cms_gp_neu/gpzh/index.php?p=gp&gem=#= Statistiklink #' target='_blank' style='font-size:0.8em;'>Quelle</a>"
,
title:
"Quelle"
}
]
});
$(
"#grid-gemeinden-einwohner"
).kendoGrid({
dataSource: dataSource,
sortable:
true
,
columns: [
{
field:
"Gemeinde"
,
title:
"Gemeinde"
,
width: 150,
attributes: {
style:
"text-align: left; font-size: 0.8em; "
},
headerAttributes: {
style:
"text-align: left; font-size: 1em; "
}
}, {
field:
"Einwohner"
,
title:
"Einwohner"
,
width: 90,
attributes: {
style:
"text-align: left;k font-size: 0.8em; "
},
headerAttributes: {
style:
"text-align: left; font-size: 1em; "
}
}
, {
template:
"<a href='http://www.web.statistik.zh.ch/cms_gp_neu/gpzh/index.php?p=gp&gem=#= Statistiklink #' target='_blank' style='font-size:0.8em;'>Quelle</a>"
,
title:
"Quelle"
}
]
});
$(
"#grid-gemeinden-auslaender"
).kendoGrid({
dataSource: dataSource,
sortable:
true
,
columns: [
{
field:
"Gemeinde"
,
title:
"Gemeinde"
,
width: 120,
attributes: {
style:
"text-align: left; font-size: 0.8em; "
},
headerAttributes: {
style:
"text-align: left; font-size: 1em; "
}
}, {
template:
"#=Auslaenderanteil# %"
,
field:
"Auslaenderanteil"
,
title:
"2012"
,
width: 70,
attributes: {
style:
"text-align: right; font-size: 0.8em;padding-right:10px;"
},
headerAttributes: {
style:
"text-align: right; font-size: 1em;padding-right:10px;"
}
}
, {
template:
"<a href='http://www.web.statistik.zh.ch/cms_gp_neu/gpzh/index.php?p=gp&gem=#= Statistiklink #' target='_blank' style='font-size:0.8em;'>Quelle</a>"
,
title:
"Quelle"
,
attributes: {
style:
"text-align: right; font-size: 0.8em;padding-right:10px;"
},
headerAttributes: {
style:
"text-align: right; font-size: 1em;padding-right:10px;"
}
}
]
});
var Person = kendo.data.Model.define({
fields: {
name: {
editable: true,
from:"name",
parse:function(v){
console.log('parse name..., v=' + v);
return v;
}
},
age:{
type:"number"
}
}
});
var person = new Person( {
name: "John Doe",
age: 42
});
01.
jQuery(ORDER_GRID_ID).kendoGrid({
02.
"change"
: XX.OrderGrid_Change,
03.
"columns"
: [{
04.
"title"
: XX.Title,
05.
"width"
:
"120px"
,
06.
"field"
:
"number"
,
07.
"filterable"
:
true
,
08.
"encoded"
:
true
09.
},
10.
{
11.
"title"
: XX.Title1,
12.
"width"
:
"200px"
,
13.
"field"
:
"status"
,
14.
"filterable"
:
true
,
15.
"encoded"
:
true
16.
},
17.
{
18.
"title"
: XX.Title2,
19.
"width"
:
"100px"
,
20.
"field"
:
"orderDate"
,
21.
"format"
:
"{0: yyyy/MM/dd}"
,
22.
"filterable"
:
true
,
23.
"encoded"
:
true
24.
},
25.
{
26.
"title"
: XX.Title3,
27.
"width"
:
"100px"
,
28.
"field"
:
"deliveryDate"
,
29.
"format"
:
"{0: yyyy/MM/dd}"
,
30.
"filterable"
:
true
,
31.
"encoded"
:
true
32.
},
33.
{
34.
"title"
: XX.Title4,
35.
"width"
:
"200px"
,
36.
"field"
:
"customer.userName"
,
37.
"filterable"
:
true
,
38.
"encoded"
:
true
39.
},
40.
{
41.
"title"
: XX.Title5,
42.
"template"
:
"#=totalRequested()# EUR"
,
43.
"field"
:
"totalRequested()"
,
44.
"filterable"
:
true
,
45.
"encoded"
:
true
46.
}],
47.
"groupable"
:
true
,
48.
"pageable"
: {
49.
"input"
:
true
,
50.
"refresh"
:
true
,
51.
"pageSizes"
: [2, 5, 10, 100],
52.
"buttonCount"
: 10
53.
},
54.
"scrollable"
: {
55.
"virtual"
:
true
56.
},
57.
"sortable"
:
true
,
58.
"selectable"
:
"Single, Row"
,
59.
"toolbar"
: [{
60.
"template"
:
'...here is an HTML with toolbar; nothing valuable to solve grouping problem...'
61.
}],
62.
"dataSource"
: {
63.
"transport"
: {
64.
"read"
:
function
(options) {
65.
getOrders(options);
66.
},
67.
},
68.
"schema"
: {
69.
"groups"
: [{
70.
"field"
:
"number"
71.
}],
72.
"data"
:
"data"
,
73.
"total"
:
"total"
74.
},
75.
"pageSize"
: 10,
76.
"serverPaging"
:
true
,
77.
"serverSorting"
:
true
,
78.
"serverFiltering"
:
true
,
79.
"serverGrouping"
:
true
, //why its not working?
80.
"serverAggregates"
:
true
,
81.
"error"
: XX.OrderGrid_Error
82.
}
83.
});