This is a migrated thread and some comments may be shown as answers.

RadScheduler Scroll to Time Slot Dynamically

1 Answer 186 Views
Scheduler
This is a migrated thread and some comments may be shown as answers.
Marlin
Top achievements
Rank 1
Marlin asked on 14 May 2020, 05:29 PM
I want to set ShowFullTime="true" and ShowFooter="false" for RadScheduler, then display it with the default start position to 8:00am (auto scroll to 8am).

1 Answer, 1 is accepted

Sort by
0
Peter Milchev
Telerik team
answered on 19 May 2020, 12:03 PM

Hello Marlin,

This can be easily achieved by setting a custom CSS class to the desired timeslot in the OnTimeSlotCreated event and then use the scrollIntoView() method of this element:

<telerik:RadCodeBlock runat="server">
    <script>
        function pageLoadHandler() {
            var scheduler = $find("<%= RadScheduler1.ClientID %>");
            var $timeslot = $telerik.$(scheduler.get_element()).find(".starter-timeslot");
                       
            if ($timeslot.length>0) {
                setTimeout(function () {
                    $timeslot[0].scrollIntoView();
                })
            }

            // Sys.Application.remove_load(pageLoadHandler);  
        }
        Sys.Application.add_load(pageLoadHandler);
    </script>
</telerik:RadCodeBlock>
<telerik:RadScheduler RenderMode="Lightweight" Font-Size="14px" runat="server" ID="RadScheduler1"
    SelectedDate="2012-04-16" ShowFullTime="true" ShowFooter="false" DayStartTime="00:00:00" DayEndTime="18:00:00"
    OverflowBehavior="Auto"
    OnTimeSlotCreated="RadScheduler1_TimeSlotCreated"
    >
</telerik:RadScheduler>

 

 

private const string ProviderSessionKey = "Telerik.Web.Examples.Scheduler.XmlSchedulerProvider.DefaultCS";

// You can safely ignore this method.
// Its purpose is to limit the changes to the underlying data only to the active user session.
protected void Page_Init(object sender, EventArgs e)
{
    Telerik.Web.UI.XmlSchedulerProvider provider;
    if ((Session[ProviderSessionKey] == null) || (!IsPostBack))
    {
        provider = new Telerik.Web.UI.XmlSchedulerProvider(Server.MapPath("~/App_Data/Appointments.xml"), true);
        Session[ProviderSessionKey] = provider;
    }
    else
    {
        provider = (Telerik.Web.UI.XmlSchedulerProvider)Session[ProviderSessionKey];
    }

    RadScheduler1.Provider = provider;
}

protected void RadScheduler1_TimeSlotCreated(object sender, TimeSlotCreatedEventArgs e)
{
    var scheduler = sender as RadScheduler;
    if (e.TimeSlot.Start.Date == scheduler.VisibleRangeStart.Date
        && e.TimeSlot.Start.Hour == 8 && e.TimeSlot.Start.Minute==0)
    {
        e.TimeSlot.CssClass += " starter-timeslot";
    }
}

 

 

Regards,
Peter Milchev
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.
Tags
Scheduler
Asked by
Marlin
Top achievements
Rank 1
Answers by
Peter Milchev
Telerik team
Share this question
or