New to Telerik UI for ASP.NET MVC? Start a free 30-day trial
Show Tooltip over Scheduler Events
Environment
Product | Telerik UI for ASP.NET MVC Scheduler |
Product Version | Created with version 2024.4.1112 |
Description
How can I show a Tooltip when hovering over the ASP.NET MVC Scheduler events to provide additional information like start and end time, description, and more?
Solution
-
Define a Tooltip component that shows when the title of a specified event is hovered.
Razor@(Html.Kendo().Scheduler<MeetingViewModel>() .Name("scheduler") ...// Additional configuration. ) @(Html.Kendo().Tooltip() .For("#scheduler") .Filter(".k-event:not(.k-event-drag-hint) > div, .k-task") .Position(TooltipPosition.Top) )
-
Create an external Kendo UI Template for the content of the Tooltip. You can modify the template content based on your requirements.
Razor@(Html.Kendo().Tooltip() .For("#scheduler") .Filter(".k-event:not(.k-event-drag-hint) > div, .k-task") .Position(TooltipPosition.Top) .Width(120) .ContentTemplateId("template") )
For a runnable example, refer to the ASP.NET MVC application in the UI for ASP.NET MVC Examples repository for how to show a Tooltip when hovering over a Scheduler event.