Skip to main content
All docs
V25.1
  • DxScheduler.ScrollTo(DxSchedulerAppointmentItem) Method

    Scrolls the scheduler’s view area to the specified appointment.

    Namespace: DevExpress.Blazor

    Assembly: DevExpress.Blazor.v25.1.dll

    NuGet Package: DevExpress.Blazor

    Declaration

    public void ScrollTo(
        DxSchedulerAppointmentItem appointment
    )

    Parameters

    Name Type Description
    appointment DxSchedulerAppointmentItem

    The target appointment.

    Remarks

    Use the ScrollTo method to scroll to the specified appointment. The method tries to place the specified appointment to the top left corner of the view. If several appointments meet the specified criteria, the scheduler scrolls to the first found appointment.

    Note that if the specified appointment is not present in the displayed view, the method does nothing.

    The following code snippet scrolls to the appointment with Id=25 on the first render:

    <style>
        .my-scheduler { 
            height: 600px; 
        } 
    </style>
    
    <DxScheduler @bind-StartDate="@StartDate"
                 DataStorage="@DataStorage"
                 @ref="Scheduler"
                 CssClass="my-scheduler">
        <DxSchedulerWorkWeekView ShowWorkTimeOnly="ShowWorkTimeOnly"></DxSchedulerWorkWeekView>
    </DxScheduler>
    
    @code {
        DateTime StartDate { get; set; } = DateTime.Today;
        bool ShowWorkTimeOnly { get; set; } = false;
        DxScheduler Scheduler { get; set; }
    
        protected override void OnAfterRender(bool firstRender) {
            base.OnAfterRender(firstRender);
            if(firstRender) {
                Scheduler.ScrollTo(DataStorage.GetAppointmentItemById(25));
            }
        }
    
        DxSchedulerDataStorage DataStorage = new DxSchedulerDataStorage() {
            AppointmentsSource = AppointmentCollection.GetAppointments(),
            AppointmentMappings = new DxSchedulerAppointmentMappings() {
                Id = "Id",
                Type = "AppointmentType",
                Start = "StartDate",
                End = "EndDate",
                Subject = "Caption",
                AllDay = "AllDay",
                Location = "Location",
                Description = "Description",
                LabelId = "Label",
                StatusId = "Status",
                RecurrenceInfo = "Recurrence"
            }
        };
    }
    
    See Also