toolbar Array|Object
When Array of commands is passed, it accepts the "pdf" and "search" commands that the scheduler will display alongside its built-in ToolBar tools. The "pdf" and "search" tools will be rendered in a fixed place within the ToolBar that cannot be changed.
The "pdf" command exports the scheduler in PDF format. The "search" option allows searching through Scheduler events titles.
Example - specify the toolbar commands as array of strings
<div id="scheduler"></div>
<script>
$("#scheduler").kendoScheduler({
toolbar: ["pdf", "search"],
date: new Date("2013/6/6"),
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 - specify the toolbar commands as array of objects
<div id="scheduler"></div>
<script>
$("#scheduler").kendoScheduler({
toolbar: [ { name: "pdf" } ],
date: new Date("2013/6/6"),
dataSource: [
{
id: 1,
start: new Date("2013/6/6 08:00 AM"),
end: new Date("2013/6/6 09:00 AM"),
title: "Interview"
}
]
});
</script>
When an object having an items field is used, that will entirely replace all tools in the Scheduler ToolBar (including the default ones). Hence, the developer will need to declare them manually in order make them appear in the component. The default order of the Scheduler tools is: [ "pdf", [ "today", "previous", "next" ], "current", { type: "spacer" }, "search", "views" ]. Note that if more than one view is defined, the last default tool is views, otherwise views is substituted by the refresh tool. Tools grouped in an array would produce a ButtonGroup in the ToolBar. Note that the pdfMobile and search tools should be explicitly enabled in order to be visible.
By using the items field, you can specify any kind and number of custom tools that will be rendered in the ToolBar. You should define the custom tools via the ToolBar items API.
Example - specify the toolbar items
<div id="scheduler"></div>
<script>
$("#scheduler").kendoScheduler({
toolbar: {
items: [
["previous", "next"],
{
name: "custom",
type: "button",
text: "Custom Button"
},
{ type: "spacer" },
"search",
"views"
]
},
date: new Date("2013/6/6"),
dataSource: [
{
id: 1,
start: new Date("2013/6/6 08:00 AM"),
end: new Date("2013/6/6 09:00 AM"),
title: "Interview"
}
]
});
</script>