Calendar Overview
The Calendar is a form component that represents a graphical Gregorian calendar.
It supports the selection of and navigation between dates as well as data templates and ranges for scheduling appointments.
The Calendar wrapper for Vue is a client-side wrapper for the Kendo UI Calendar widget.
Basic Usage
The following example demonstrates the Calendar in action.
Functionality and Features
- Disabled dates
- Date ranges
- Active view and view depth
- Week number column
- Multiple selection
- Templates
- Keyboard navigation
- RTL support
Events
The following example demonstrates basic Calendar events. You can subscribe to all Calendar events by the handler name.
<div id="vueapp" class="vue-app">
<kendo-calendar v-on:navigate="onNavigate"></kendo-calendar>
</div>
Vue.use(DateinputsInstaller);
new Vue({
el: '#vueapp',
methods: {
onNavigate: function (e) {
var view = e.sender.view();
console.log(view.name); //the name of the current view
var current = e.sender.current();
console.log(current); //currently the focused date
}
}
})