Prevent date change when navigating Scheduler with keyboard arrows

[Jack Dunn]

Good morning,

If I am clicked on the furthest-left column and press left arrow key <, then the scheduler changes to the previous day.

Likewise, if I am on the furthest-right column and press right arrow key >, then the scheduler changes to the next day.

How can I prevent this from happening?

 

[Vijay Ravi]

Hi Jack,

Sample: https://stackblitz.com/edit/prevent-previous-and-next-action-while-click-arro-x9zlzy?file=index.js

actionBegin api: https://helpej2.syncfusion.com/react/documentation/api/schedule/#actionbegin

As per your request, we have prepared a sample to prevent the previous and next actions while clicking the arrow keys. We suggest that you use the actionBegin event and args.requestType as "dateNavigate" and only prevent click actions, as shown in the highlighted code snippet below. Please try the sample and let us know if you require any further assistance.

[index.js]

  function onActionBegin(args) {

    if (args.requestType === 'dateNavigate' && args.event.type == 'click') {

      args.cancel = true;

    }

  }

 

  return (

    <div className='schedule-control-section'>

      <div className='col-lg-12 control-section'>

        <div className='control-wrapper'>

          <ScheduleComponent

            width='100%'

            height='650px'

            selectedDate={new Date(2021, 1, 15)}

            ref={t => (scheduleObj = t)}

            eventSettings={{ dataSource: data }}

            eventRendered={onEventRendered.bind(this)}

            actionBegin={onActionBegin.bind(this)}

          >

            <ViewsDirective>

              <ViewDirective option='Day' />

            </ViewsDirective>

            <Inject services={[Day, Week, WorkWeek, Month, Agenda, Resize, DragAndDrop]} />

          </ScheduleComponent>

        </div>

      </div>

    </div>

Regards,

Vijay Ravi

[Jack Dunn]

Hi Vijay, 

Thank you very much. I had to check for key press using:

event.type === "keydown" 

[Vinitha Devi Murugan]

Hi Jack,

You are most welcome. Let us know if you need any further assistance. 

Regards,

Vinitha