• Material 3
  • Fluent
  • Fluent 2
  • Bootstrap 5
  • Tailwind CSS
  • High Contrast
  • Fluent 2 High Contrast
Preferences
Mode Selection
Touch
Mouse
Theme Selection
Theme Mode
Localization
*Translated by Google Translator.
Currency

Example of Room Scheduler in ASP.NET Core Scheduler Control

This demo showcases the scheduler that lists out the meeting rooms of an office and its availability. The slots which are already booked and the lunch time can’t be allowed for any new bookings. Also, the existing bookings which were made on past dates were not allowed to edit as well as the new bookings on those past dates will also be not allowed.

DEMO
SOURCE

Here, the timeline view is grouped with single level of resources by making use of the group property. Also, the lunch time blocking is done by applying styles on those cells through the renderCell event. The event editor and popup is prevented to open on those blocked time slots as well as on the past bookings by making use of the popupOpen event. The eventRendered event is utilized in order to make the bookings done on past dates as read-only. To block more than one bookings per slot, the isSlotAvailable method is used. Also, the resource header displayed at the left panel is customized to render as columns with the help of resourceHeaderTemplate. The tooltip for resource header is customized by defining the headerTooltipTemplate property within the group API.

Note: The dates which lies beyond the current date set to scheduler through selectedDate property is considered as the past dates here in this sample.

Transform your ASP.NET Core web apps today with Syncfusion ASP.NET Core components
85+ high-performance and responsive UI components
Dedicated support
Hassle-free licensing
TRY IT FOR FREE
opens in a new tab