views.group Object
The configuration of the view resource(s) grouping.
views.group.date Boolean
(default: false)
If set to true
and the group.resources has some resources set the view is grouped by date.
Overrides the date option of the scheduler.
Example - define group by date
<div id="scheduler"></div>
<script>
$("#scheduler").kendoScheduler({
date: new Date("2013/6/6"),
views: [
{
type: "month",
group: {
date: true
}
}
],
group: {
resources: ["Rooms"]
},
dataSource: [
{
id: 1,
start: new Date("2013/6/6 08:00 AM"),
end: new Date("2013/6/6 09:00 AM"),
title: "Interview",
roomId: 1 // the event is held in "Small meeting room" whose value is 1
},
{
id: 2,
start: new Date("2013/6/6 08:00 AM"),
end: new Date("2013/6/6 09:00 AM"),
title: "Meeting",
roomId: 2 // the event is held in "Big meeting room" whose value is 2
}
],
resources: [
{
field: "roomId",
name: "Rooms",
dataColorField: "key",
dataSource: [
{ text: "Small meeting room", value: 1, key: "#aabbcc" },
{ text: "Big meeting room", value: 2, key: "green" }
]
}
]
});
</script>
views.group.orientation String
(default: "horizontal")
The orientation of the group headers. Supported values are horizontal or vertical. Note that the agenda view is always in vertical orientation.
Example - disable delete confirmation
<div id="scheduler"></div>
<script>
$("#scheduler").kendoScheduler({
date: new Date("2013/6/6"),
views: [
{
type: "month",
group: {
orientation: "vertical"
}
}
],
group: {
resources: ["Rooms"]
},
dataSource: [
{
id: 1,
start: new Date("2013/6/6 08:00 AM"),
end: new Date("2013/6/6 09:00 AM"),
title: "Interview",
roomId: 1 // the event is held in "Small meeting room" whose value is 1
},
{
id: 2,
start: new Date("2013/6/6 08:00 AM"),
end: new Date("2013/6/6 09:00 AM"),
title: "Meeting",
roomId: 2 // the event is held in "Big meeting room" whose value is 2
}
],
resources: [
{
field: "roomId",
name: "Rooms",
dataColorField: "key",
dataSource: [
{ text: "Small meeting room", value: 1, key: "#aabbcc" },
{ text: "Big meeting room", value: 2, key: "green" }
]
}
]
});
</script>