views.slotTemplate String|Function
The template used to render the time slot cells.
The fields which can be used in the template are:
- date - represents the slot date and time.
- resources() - returns the relevant resources for the current slot.
The
slotTemplate
option is supported when views.type is set to "day", "week", "workWeek" or "timeline" views.
Example - set the slot template
<div id="scheduler"></div>
<script>
$("#scheduler").kendoScheduler({
date: new Date("2013/6/6"),
views: [
{
type: "day",
slotTemplate: kendo.template("<strong>#=kendo.toString(date)#</strong>")
}
],
dataSource: [
{
id: 1,
start: new Date("2013/6/6 08:00 AM"),
end: new Date("2013/6/6 09:00 AM"),
title: "Interview"
}
]
});
</script>
Example - modify the slot based on resources
<div id="scheduler"></div>
<script id="slotTemplate" type="text/x-kendo-template">
# var resources = data.resources(); #
# var color = resources.roomId === 1 ? "red" : "blue"; #
<span style="background: #=color#">
#=kendo.toString(date, "d")#
</span>
</script>
<script>
$("#scheduler").kendoScheduler({
date: new Date("2013/6/6"),
views: [{
type: "day",
slotTemplate: kendo.template($("#slotTemplate").html())
}],
group: {
resources: ["Rooms"]
},
resources: [
{
field: "roomId",
name: "Rooms",
dataSource: [
{ text: "Meeting Room 101", value: 1, color: "#6eb3fa" },
{ text: "Meeting Room 201", value: 2, color: "#f58a8a" }
],
title: "Room"
}
]
});
</script>