Kendo UI for Angular MultiViewCalendar Overview

The Kendo UI for Angular MultiViewCalendar is an Angular form control that represents a graphical Gregorian calendar with multiple horizontal views.

It supports the selection of and navigation between dates as well as data templates and ranges for scheduling appointments.

ninja-iconThe MultiViewCalendar is part of Kendo UI for Angular, a professional grade UI library with 110+ components for building modern and feature-rich applications. To try it out sign up for a free 30-day trial.Start Free Trial

The following example demonstrates the MultiViewCalendar in action.

Change Theme
Theme
Loading ...

Key Features

  • Disabled MultiViewCalendar—You can use the configuration options of the MultiViewCalendar to disable the component so that users are not able to interact with it.
  • Focused and selected dates—You can also control the focused and selected dates within the MultiViewCalendar.
  • Disabled dates—The MultiViewCalendar supports specific approaches for disabling a selection of dates such as through using a function, an array of dates, or an array of days.
  • Active view—You can control the initially loaded page of the Calendar and render it in a month, year, decade, or year view.
  • Multiple views—You can also control the number of the horizontally rendered MultiViewCalendar views.
  • View header—The MultiViewCalendar provides options for rendering a header for each view.
  • View selection depth—The MultiViewCalendar provides an option for setting the view depth to which the user can navigate.
  • Navigation animation—You can enable the navigation animation for the MultiViewCalendar.
  • Selection modes—Apart form its default single selection mode, the MultiViewCalendar supports options for multiple, range, and week selection.
  • Templates—You can customize the content of each Calendar cell and define a cell template.
  • Week number column—The Calendar also supports options for rendering a column displaying the number of the weeks.
  • Forms support—You can use the Calendar both in template-driven and reactive Angular forms.
  • Integration with JSON—As the Calendar works only with date JavaScript instances while the received data from the server is serialized in a JSON format, the component provides options for binding it to dates which are serialized as strings.
  • Globalization—All Kendo UI for Angular Date Inputs provide globalization options.
  • Accessibility—The Calendar is accessible for screen readers and supports WAI-ARIA attributes.
  • Keyboard navigation—The Calendar supports a number of keyboard shortcuts for processing various commands.

Support and Learning Resources

Additional Resources