Scroll to specified day in TimelineMonth view

Good day!

I have a schedule control in a web page in order to show requests (events) of people (resources), for example vacations, exam days, etc.

Currently, I've setup the schedule control to show 3 months in the view using the interval property, and set the selectedDate as the current (today) date:

views: [{
option: 'TimelineMonth',
interval: 3,
eventTemplate: '#timeline-event-template',
allowVirtualScrolling: true,monthsCount: 3
}],
selectedDate: new Date(2022, 6, 28)

What I'd like to do: Show people's requests 1 month before and 1 month after the current month (3-month view window). For instance: june/july/august.

What the schedule control does: It correcly shows 3 months in the view, but always starting from the 1st day of the month indicated by selectedDate.

What I've tried so far: I passed the 1st day of the previous month to the schedule control using the selectedDate property. This works, but obviously today is not in focus. So whenever I call schedule.scrollTo(null, new Date()) in order to focus on today, the interval window is changed and now the 1st day shown is not what I set originally, it's the 1st day of the current month.

Example

If today is 2022-07-28, I set:

selectedDate: new Date(2022, 5, 1)  // 1st of june, so the 3 month view is june 1-all july-august 31

When I call scrollTo(null, new Date()): the schedule resets the 3 month view and shows july 1-all august-september 30.


Is there a way to call scrollTo, and avoid a reset of the view if the passed date is INSIDE [selectedDate + interval]?

Thank you!

Alex




3 Replies

RM Ruksar Moosa Sait Syncfusion Team July 29, 2022 07:56 AM UTC

Hi Alejandro,


Greetings from Syncfusion support.


We have validated your reported problem by preparing a sample at our end, but it works as expected. Kindly try the below sample and get back to us with the below details if you still facing the same problem that helps us to validate the issue further and provide the solution earlier.


  • Share with us an issue reproducing video demo.
  • Share the issue reproducing code snippets or
  • Replicate the issue in the below sample if possible.


Sample: https://stackblitz.com/edit/cotmeh?file=index.js


Regards,

Ruksar Moosa Sait



AL Alejandro August 1, 2022 10:33 PM UTC

Hello Ruksar,


I was able to make the schedule focus on the current date without changing the 3-month interval.


Thank you so much for your assistance!,

Regards

Alex




RV Ravikumar Venkatesan Syncfusion Team August 2, 2022 05:01 AM UTC

Hi Alejandro,


Thanks for the update.


We are happy that you have achieved your requirement.


Regards,

Ravikumar Venkatesan


Loader.
Up arrow icon