Scheduler

Directive

kendo-scheduler

Child Components

• kendo-scheduler-resource
• kendo-scheduler-view

Props

all-day-event-template String | Function

The template for render the All day Scheduler events (allDayEventTemplate in Kendo UI for jQuery).

The template supports the following fields:

• description (String)—The description of the event.
• end (Date)—The date of the event.
• isAllDay (Boolean)—If set to true, the event is an all-day event.
• resources (Array)—The resources of the event.
• start (Date)—The start date of the event.
• title (String)—The title of the event.

all-day-slot Boolean

If all-day-slot is set to true, the Scheduler will display a slot for the All day events (allDaySlot in Kendo UI for jQuery).

auto-bind Boolean

If auto-bind is set to false, the Scheduler will not bind to the data source during initialization (autoBind in Kendo UI for jQuery). In this case, data binding will occur when the change event of the data source is fired. By default, the widget will bind to the data source specified in the configuration.

current-time-marker Boolean | Object

If current-time-marker is set to false, the current time marker of the Scheduler would not be displayed (currentTimeMarker in Kendo UI for jQuery). The supported composite props are available in CurrentTimeMarkerProps.

data-source Object | Array

The data source of the Scheduler which contains the Scheduler events (dataSource in Kendo UI for jQuery).

You can set data-source to:

• A JavaScript object which represents any valid data source configuration.
• A JavaScript array.
• An existing kendo.data.SchedulerDataSource instance.

If the dataSource option is set to a JavaScript object or an array, the Scheduler will initialize a new kendo.data.SchedulerDataSource instance by using that value as a data source configuration. If the dataSource option is an existing kendo.data.SchedulerDataSource instance, the Scheduler will use that instance and will not initialize a new one.

date Date

The current date of the Scheduler (date in Kendo UI for jQuery). Used to determine the displayed period.

date-header-template String | Function

The template for rendering the date header cells (dateHeaderTemplate in Kendo UI for jQuery). By default, the Scheduler renders the date by using a custom ddd M/dd format. The ddd specifier represents the abbreviated name of the week day and will be localized based on the current Kendo UI culture. To control the order of the days and months, define a custom template. The template supports the date field which represents the major tick date.

editable Boolean | Object

If editable is set to true, the user will be able to create new Scheduler events and modify or delete existing ones (editable in Kendo UI for jQuery). The supported composite props are available in EditableProps.

end-time Date

The end time of the Week and Day views (endTime in Kendo UI endtime jQuery). The Scheduler will display events which end before the endTime value.

event-template String | Function

The template for rendering the Scheduler events (eventTemplate in Kendo UI for jQuery).

The template supports the following fields:

• description (String)—The description of the event.
• end (Date)—The date of the event.
• resources (Array)—The resources of the event.
• start (Date)—The start date of the event.
• title (String)—The title of the event.

footer Boolean | Object

If footer is set to false, the footer of the Scheduler will not be displayed (footer in Kendo UI for jQuery). The supported composite props are available in FooterProps.

group Object

The configuration for grouping the Scheduler resources (group in Kendo UI for jQuery). The supported composite props are available in GroupProps.

group-header-template String | Function

The template for rendering the group headers of the Day, Week, Work week, and Timeline views (groupHeaderTemplate in Kendo UI for jQuery).

The template supports the following fields:

• text (String)—The text for the group.
• color (String)—The color for the group.
• value—The value for the group.
• field (String)—The field of the Scheduler event which contains the resource id.
• title (String)—The title option of the resource.
• name (String)—The name option of the resource.

height Number | String

The height of the Scheduler (height in Kendo UI for jQuery). Numeric values are treated as pixels.

major-tick Number

The number of minutes that are represented by a major tick (majorTick in Kendo UI for jQuery).

major-time-header-template String | Function

The template for rendering the major ticks (majorTimeHeaderTemplate in Kendo UI for jQuery). By default, the Scheduler renders the time based on the current culture time format. The template supports the date field which epresents the major tick date.

max Date

Limits the maximum date which can be selected through the Scheduler navigation (max in Kendo UI for jQuery).

messages Object

The configuration of the Scheduler messages (messages in Kendo UI for jQuery). Used for customization and localization of the Scheduler messages. The supported composite props are available in MessagesProps.

min Date

Limits the minimum date which can be selected through the Scheduler navigation (min in Kendo UI for jQuery).

minor-tick-count Number

The number of time slots that will be displayed per major tick (minorTickCount in Kendo UI for jQuery).

minor-time-header-template String | Function

The template for rendering the minor ticks (minorTimeHeaderTemplate in Kendo UI for jQuery). By default, the Scheduler renders  . The template supports date field which represents the major tick date.

mobile Boolean | String

If mobile is set to true and the Scheduler is viewed in a mobile browser, it will use adaptive rendering (mobile in Kendo UI for jQuery). Can be set to a phone or tablet string which will force the Scheduler to use adaptive rendering regardless of the browser type.

pdf Object

Configures the PDF export settings of the Scheduler (pdf in Kendo UI for jQuery). The supported composite props are available in PdfProps.

resources Array

The configuration of the Scheduler resources (resources in Kendo UI for jQuery). A Scheduler resource is optional metadata that can be associated with a Scheduler event.

selectable Boolean

If selectable is set to true, the user will be able to select Scheduler cells and events (selectable in Kendo UI for jQuery). By default, selectable is disabled.

show-work-hours Boolean

If show-work-hours is set to true, the view will be initially shown in the business-hour mode (showWorkHours in Kendo UI for jQuery). By default, a view is displayed in the full-day mode.

snap Boolean

If snap is set to true, the Scheduler will snap events to the nearest slot during dragging (resizing or moving) (snap in Kendo UI for jQuery). To allow the free moving and resizing of events, set snap to false.

start-time Date

The start time of the Day and Week views. The Scheduler will display events which start after the startTime value (startTime in Kendo UI for jQuery).

timezone String

The timezone which the Scheduler will use to display the Scheduler appointment dates (timezone in Kendo UI for jQuery). By default, the Scheduler uses the timezone of the current system. While this approach is useful when the Scheduler is bound to a local array of events, you need to specify a timezone if the Scheduler is bound to a remote service. In this way, all users will be able to see the same dates and times regardless of the configured timezones on their systems. The complete list of the supported timezones is available in the List of IANA time zones Wikipedia page.

toolbar Array

The list of commands that the Scheduler will display as buttons in its toolbar (toolbar in Kendo UI for jQuery). Currently, the Scheduler supports the pdf command which exports the Scheduler in PDF format. The supported composite props are available in ToolbarProps.

views Array

The views that are displayed by the Scheduler and their configuration (views in Kendo UI for jQuery).

The supported array items are:

• Objects—Specify the view configuration.
• Strings—Represent the view types (assuming the default configuration).

By default, the Scheduler displays the Day and Week views.

width Number | String

The width of the Scheduler (width in Kendo UI for jQuery). Numeric values are treated as pixels.

work-day-start Date

The start of the work day when the user clicks the Show business hours button (workDayStart in Kendo UI for jQuery).

work-day-end Date

The end of the work day when the user clicks the Show business hours button (workDayEnd in Kendo UI for jQuery).

work-week-start Number

The start of the working week (index-based) (workWeekStart in Kendo UI for jQuery).

work-week-end Number

The end of the working week (index-based) (workWeekEnd in Kendo UI for jQuery).

Events

add: Function

Fires when a new event is about to be added (add in Kendo UI for jQuery). The event handler function context (available through the this keyword) will be set to the Scheduler instance.

cancel: Function

Fires when the user cancels editing by clicking the Cancel button (cancel in Kendo UI for jQuery). The event handler function context (available through the this keyword) will be set to the Scheduler instance.

change: Function

Fires when the user selects a cell or event in the Scheduler (change in Kendo UI for jQuery). The event handler function context (available through the this keyword) will be set to the Scheduler instance.

databinding: Function

Fires before the Scheduler binds to its data source (dataBinding in Kendo UI for jQuery). The event handler function context (available through the this keyword) will be set to the Scheduler instance.

databound: Function

Fires when the Scheduler is bound to data from its data source (dataBound in Kendo UI for jQuery). The event handler function context (available through the this keyword) will be set to the Scheduler instance.

edit: Function

Fires when the user opens a Scheduler event in the edit mode or creates a new event (edit in Kendo UI for jQuery). The event handler function context (available through the this keyword) will be set to the Scheduler instance.

movestart: Function

Fires when the user starts to drag an event (moveStart in Kendo UI for jQuery). The event handler function context (available through the this keyword) will be set to the Scheduler instance.

move: Function

Fires when the user is moving an event (move in Kendo UI for jQuery). The event handler function context (available through the this keyword) will be set to the Scheduler instance.

moveend: Function

Fires when the user stops moving an event (moveEnd in Kendo UI for jQuery).The event handler function context (available through the this keyword) will be set to the Scheduler instance.

navigate: Function

Fires when the user changes the selected date or view (navigate in Kendo UI for jQuery). The event handler function context (available through the this keyword) will be set to the Scheduler instance.

pdfexport: Function

Fires when the user clicks the Export to PDF toolbar button (pdfExport in Kendo UI for jQuery).

remove: Function

Fires when the user performs the destroy action (remove in Kendo UI for jQuery). The event handler function context (available through the this keyword) will be set to the Scheduler instance.

resizestart: Function

Fires when the user starts to resize an event (resizeStart in Kendo UI for jQuery). The event handler function context (available through the this keyword) will be set to the Scheduler instance.

resize: Function

Fires when the user is resizing an event (resize in Kendo UI for jQuery). The event handler function context (available through the this keyword) will be set to the Scheduler instance.

resizeend: Function

Fires when the user releases the mouse after resizing an event (resizeEnd in Kendo UI for jQuery). The event handler function context (available through the this keyword) will be set to the Scheduler instance.

save: Function

Fires when the user saves a Scheduler event by clicking the Save button (save in Kendo UI for jQuery). The event handler function context (available through the this keyword) will be set to the Scheduler instance.

Methods

For more details about the methods available in the component's API please check its Kendo UI for jQuery API documentation.

kendoWidget

returns

Returns the Kendo UI Scheduler instance.