ASP.NET Core MultiViewCalendar Overview

The MultiViewCalendar is part of Telerik UI for ASP.NET Core, 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.

Download Free Trial

The Telerik UI MultiViewCalendar TagHelper and HtmlHelper for ASP.NET Core are server-side wrappers for the Kendo UI MultiViewCalendar widget.

The MultiViewCalendar renders a graphical Gregorian calendar with multiple horizontal views.

• Demo page for the MultiViewCalendar HtmlHelper

• Demo page for the MultiViewCalendar TagHelper

Initializing the MultiViewCalendar

1. Make sure you followed all the steps from the introductory article on Telerik UI for ASP.NET Core.

2. Create a new action method which renders the view.

       public ActionResult Index()
       {
           return View();
       }
   

3. Add a MultiViewCalendar.

           @(Html.Kendo().MultiViewCalendar()
               .Name("MultiViewCalendar") // The name of the MultiViewCalendar is mandatory. It specifies the "id" attribute of the widget.
               .Min(new DateTime(2010, 1, 1, 10, 0, 0)) // Set the min time of the MultiViewCalendar.
               .Max(new DateTime(2010, 1, 1, 20, 0, 0)) // Set the min date of the MultiViewCalendar.
               .Value(DateTime.Now) // Set the value of the MultiViewCalendar.
           )
   

             <kendo-multiviewcalendar name="multiviewcalendar"
                                      min="new DateTime(2010, 1, 1, 10, 0, 0)"
                                      max="new DateTime(2010, 1, 1, 20, 0, 0)"
                                      value="DateTime.Now">
             </kendo-multiviewcalendar>
   

Functionality and Features

• Active view—You can select one of the predefined Views of the MultiViewCalendar.
• Multiple views—The MultiViewCalendar allows you to define the number of views and months that are displayed at a time.
• Selection—The component allows you to select multiple dates by using the multiple-view selection mode.
• Day template—The MultiViewCalendar enables you to customize the rendered day for the month view.
• Disable dates—The MultiViewCalendar allows you to disable certain days which are not intended to be selected by the end user such as weekends, national holidays, and others.
• Week column—You can choose to render a column which displays the number of the weeks within the current month view.
• Keyboard navigation—The keyboard navigation of the MultiViewCalendar is always available.
• Century cells format—The component exposes two formats for the century cells.
• Reverse selection—The component allows you to pick an end date which is before the start date.
• Show other month days—The component allows you to control if the days from the previous/next months will be displayed.

Next Steps

• Getting Started with the MultiViewCalendar

• Basic Usage of the MultiViewCalendar for ASP.NET Core (Demo)

• MultiViewCalendar in Razor Pages

See Also

• Using the API of the MultiViewCalendar (Demo)
• Knowledge Base Section