Challenge the behavior : How to hide dates in RadScheduler using jQuery

Introduction

RadScheduler is a control provided by Telerik that allows you to display and manage appointments and events in various calendar views. It is commonly used in applications where scheduling and time management are important, such as in healthcare systems, project management software, and booking systems.

Some of the key features of RadScheduler include

• Multiple views: RadScheduler provides various calendar views, such as day, week, month, and timeline views, allowing you to display appointments and events in the most appropriate format.
• Customizable appearance: You can customize the appearance of the scheduler to match your application’s look and feel, including the colors, fonts, and styles of the various elements.
• Recurring appointments: RadScheduler allows you to create appointments that recur on a regular basis, such as daily, weekly, or monthly appointments.
• Drag-and-drop support: You can easily move appointments by dragging and dropping them to a new time or date.
• Built-in dialogs: RadScheduler includes built-in dialogs for creating, editing, and deleting appointments, making it easy for users to interact with the scheduler.
• Data binding: RadScheduler can be bound to various data sources, such as databases or web services, allowing you to display and manage data dynamically.

Overall, RadScheduler is a powerful and flexible tool for managing appointments and events in a variety of applications.

How to hide dates in RadScheduler using jQuery

Sometimes developer need to hide the date of Scheduler for fulfill the customer requirement, so below we are talking how to hide dates in RadScheduler using jQuery. This is mainly focus on Weekly view you can change according to your requirement.

CS File

protected void SchedulerTimeSlotCreated(object sender, TimeSlotCreatedEventArgs e)
{
        e.TimeSlot.CssClass = "HideDates";
}

ASPX File

function pageLoad() {
      if ($find('<%=rsRoomBooking.ClientID %>').get_selectedView() ==      

                                          Telerik.Web.UI.SchedulerViewType.WeekView) {
            let hideDaysIndexes = new Array();
            var $ = $telerik.$;

           $('.HideDates').each(function (i) {
                  hideDaysIndexes.push($(this).index());
          });

           for (x in hideDaysIndexes) {
                   $($(".rsHorizontalHeaderTable tr:nth-child(1) th",                      
                                $find('<%=rsRoomBooking.ClientID
                              %>').get_element()).get(hideDaysIndexes[x])).find('a').remove();
           }

                $('.rsContentTable tr .HideDates').css("pointer-  
                  events","none");
                hideDaysIndexes = [];
          }
}

CSS File

.HideDates{
       background: #ddd !important;
}