Validate Timeslot Availability against Existing Recurrence Rules

Environment

Product	Telerik UI for ASP.NET Core Scheduler
Product Version	Created with version 2024.4.1112

Description

How can I validate if the Timeslot of a new event is available based on the existing recurrence rules of the ASP.NET Core Scheduler?

Solution

The following example shows how to validate server-side when a new event is about to be created. If the validation fails, the event is not saved, and the user receives an error message that the selected time does not have available slots.

1. Validate the data of the new event in the Create action based on your requirements, and add a ModelState error if the current timeslot is not available. Return a collection with the created event and pass the ModelState to the ToDataSourceResult() method.

   C#

       public virtual JsonResult Meetings_Create([DataSourceRequest] DataSourceRequest request, MeetingViewModel meeting)
       {
           if (ModelState.IsValid)
           {
               if (CheckEventSlot(meeting)) // Validate the timeslot availability.
               {
                   meetingService.Insert(meeting, ModelState);
               }
               else
               {
                   ModelState.AddModelError("start", "The new event is not allowed because the timeslot is unavailable.");
               }
           }
           return Json(new[] { meeting }.ToDataSourceResult(request, ModelState));
       }
   
       private bool CheckEventSlot(MeetingViewModel newMeeting)
       {
           foreach (var meeting in meetingService.GetAll())
           {
               if (!string.IsNullOrEmpty(meeting.RecurrenceRule))
               {
                   var start = meeting.Start;
                   var end = meeting.End;
                   var recRule = meeting.RecurrenceRule;
   
                   var condition = false; // Here you can use 3rd party software like iCal.Net to build up the condition.
                   if (condition)
                   {
                       return false;
                   }
               }
           }
           return true;
       }

2. Handle the Error event of the Scheduler DataSource and display the error message to the user.

   Razor

           @(Html.Kendo().Scheduler<MeetingViewModel>()
               .Name("scheduler")
               ...// Additional configuration.
               .DataSource(d => d
                   .Events(e => e.Error("onError"))
                   ...// Additional configuration.
               )
           )

   Razor

       @addTagHelper *, Kendo.Mvc
   
       <kendo-scheduler name="scheduler">
           <!-- Other configuration -->
           <scheduler-datasource type="@DataSourceTagHelperType.Ajax" on-error="onError">
               <!-- Other configuration -->
           </scheduler-datasource>
       </kendo-scheduler>

   JS

   <script type="text/javascript">
       function onError(args) { // The event will fire when there are Model State errors.
           var errors = args.errors; // Get the received errors.
           var message = "";
           var scheduler = $("#scheduler").data("kendoScheduler");
           if (errors) {
               scheduler.one("dataBinding", function (e) { // Subscribe to the "dataBinding" event of the Scheduler once.
                   e.preventDefault(); // Prevent the default event action.
                   $.each(errors, function (key, value) { // Loop through the errors.
                       if ('errors' in value) {
                           $.each(value.errors, function() {
                               message += this + "\n"; // Store the messages in a variable.
                           });
                       }
                   });
                   alert(message); // Display the message.
               });
           }
       }
   </script>

For a runnable example, refer to the ASP.NET MVC application in the UI for ASP.NET MVC Examples repository. You can use this as a starting point to configure the same behavior in an ASP.NET Core project.

More ASP.NET Core Scheduler Resources

• ASP.NET Core Scheduler Documentation

• ASP.NET Core Scheduler Demos

• ASP.NET Core Scheduler Product Page

• Telerik UI for ASP.NET Core Video Onboarding Course (Free for trial users and license holders)

• Telerik UI for ASP.NET Core Forums

See Also

• Client-Side API Reference of the Scheduler for ASP.NET Core

• Server-Side API Reference of the Scheduler for ASP.NET Core

• Server-Side TagHelper API Reference of the Scheduler for ASP.NET Core

• Telerik UI for ASP.NET Core Breaking Changes

• Telerik UI for ASP.NET Core Knowledge Base