MultiViewCalendar Tag Helper Overview
The MultiViewCalendar Tag Helper extension is a server-side wrapper for the Kendo UI MultiViewCalendar widget.
Configuration
Below are listed the steps for you to follow when configuring the Kendo UI MultiViewCalendar.
Make sure you followed all the steps from the introductory article on Telerik UI for ASP.NET Core.
Create a new action method which renders the view.
Example
public ActionResult Index()
{
return View();
}
- Add a MultiViewCalendar.
Example
<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>
@(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.
)
Functionality and Features
Event Handling
You can subscribe to all MultiViewCalendar events.
By Handler Name
The following example demonstrates how to subscribe to events by a handler name.
Example
<kendo-multiviewcalendar name="multiviewcalendar" on-change="calendar_change" on-navigate="calendar_navigate">
</kendo-multiviewcalendar>
<script>
function calendar_navigate() {
//Handle the navigate event.
}
function calendar_change() {
//Handle the change event.
}
</script>
@(Html.Kendo().MultiViewCalendar()
.Name("MultiViewCalendar")
.Events(e => e
.Change("calendar_change")
.Navigate("calendar_navigate")
)
)
<script>
function calendar_navigate() {
//Handle the navigate event.
}
function calendar_change() {
//Handle the change event.
}
</script>