Progress® Telerik® UI for ASP.NET AJAX Feedback Portal
Back to Feed
Request a Feature Report a Bug
Completed
Last Updated: 15 Oct 2020 18:18 by ADMIN
Rohit
Created on: 12 May 2018 10:01
Category: Scheduler
Type: Feature Request
1
how can we show only working hour in timeline view in rad scheduler and hide non working hour.
Hi,
Please suggest me how can we show only working hour in timeline view in rad scheduler and hide non working hour. 

Currently in timeline view all 24 hour time slot is showing , but I want to show only working hour in time slot and hide rest of non working hour for there.

Screen shot for current view and desired view is attached below .
Attached Files:
1 comment
ADMIN
Peter Milchev
Posted on: 15 Oct 2020 18:18

Hello Rohit,

The TimeSlotCreated event allows you to assign a CSS class to the timeslot. Then, with the script below, you can hide these slots and their respective headers:

 

<telerik:RadScheduler RenderMode="Lightweight" runat="server" ID="RadScheduler1" 
    Height="600px" SelectedDate="2012-04-16" Font-Size="14px" AccessKey="F" TabIndex="1" SelectedView="TimelineView" GroupBy="User" GroupingDirection="Vertical" RowHeight="50px" OnTimeSlotCreated="RadScheduler1_TimeSlotCreated"
    DayStartTime="08:00:00" DayEndTime="23:00:00" OverflowBehavior="Auto">
    <TimelineView SlotDuration="01:00:00" NumberOfSlots="40" ColumnHeaderDateFormat="HH:mm" />
    <AdvancedForm Modal="true" />
</telerik:RadScheduler>
<script>
    function pageLoadHandler() {
        $telerik.$(".rsTimelineView .rsContentWrapper .disabled-slot").each(function (ind, item) {
            var position = $telerik.$(item).hide().index();
            $telerik.$(".rsHorizontalHeaderTable th").eq(position).hide();
        })
        // Sys.Application.remove_load(pageLoadHandler);  
    }
    Sys.Application.add_load(pageLoadHandler);
</script>
 protected void RadScheduler1_TimeSlotCreated(object sender, TimeSlotCreatedEventArgs e)
    {
        if (e.TimeSlot.Start.Hour > 18)
        {
            e.TimeSlot.CssClass += "disabled-slot";
        }
    }

With this approach you need to keep in mind 2 things:

  1. The number of slots will stay the same, meaning when you hide slots you will see fewer slots than assigned(e.g. you set 40 slots, hide 10, and will see only 30 slots)
  2. There should be no appointments during the hidden hours.

 

Regards,
Peter Milchev
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Create an account Log In
View
Type
Status
Category