UI Builder Calendar component:switch from Timeline WorkWeek to TimelineDay when clicking day header

itoma
Tera Contributor

Hi everyone,

I am working with the Calendar component in UI Builder and I am trying to implement a drill-down behavior between calendar views.


Current setup:

  • Calendar component is displayed by default in Work Week view of type Timeline;
  • The X-axis shows the work days, for example:
    • 05 Monday
    • 06 Tuesday
    • 07 Wednesday
    • 08 Thursday
    • 09 Friday
  • I also have the Calendar view selector enabled, so the user can manually switch to Day view of type Timeline

Requirement:

When the user clicks a day header/column in the Timeline Work Week view, for example 06 Tuesday, I want the Calendar component to automatically switch to Timeline Day view and set the selected date to the clicked day.


Expected behavior:

  1. Calendar opens in Timeline Work Week
  2. User clicks the day header/column for 06 Tuesday
  3. Calendar automatically changes to Timeline Day
  4. The displayed date becomes Tuesday, February 06, 2024

I checked the Calendar component Events tab in UI Builder, but I could not find an event handler that exposes a click on the day header/column or a selected date change that I can use to update the Calendar view and selected date.
I do not see a supported way to capture the clicked day from the Timeline Work Week header/grid.

I attached screenshots showing:

  1. Default Timeline Work Week view
  2. Click on 06 Tuesday
  3. Desired result: Timeline Day view for Tuesday, February 06, 2024

Thanks in advance!

0 REPLIES 0