cellDoubleClick and swipe-to-select cells not working on mobile phone (both iOS and andorid)

[Aletia Trakakis]

I am using 'cellDoubleClick' callback on ScheduleComponent. It is working fine on desktop. I have also a functionality where user selects and swipes on cells, to create events on all those selected-cells.
These two features are working fine on laptop, but its not working on mobile phone. I have tested on both android and iOS. Please guide me how to fix it.

[Vijay Ravi]

Hi Aletia

Scheduler Interaction docs:  https://ej2.syncfusion.com/react/documentation/schedule/scheduler-interactions

Refer to the above-shared documentation for touch interaction supports provided for Schedule in mobile devices.

Q1: cellDoubleClick:

Sample: https://stackblitz.com/edit/ej2-react-schedule-popup-open-event-customization?file=index.js

We suggest you use popupOpen event of the Schedule instead of cellDoubleClick. The popupOpen event is triggered on both Desktop and Mobile mode when the Schedule editor is opened. So, you can check if popupOpen args.type === “Editor” and perform your cellDoubleClick event customized inside that if condition.

[index.js]

import { extend, closest } from '@syncfusion/ej2-base';

 

function LocalData() {

  function onPopupOpen(args) {

    if (args.type === "Editor" && args.target && closest(args.target, '.e-work-cells,.e-vertical-view .e-date-header-wrap .e-all-day-cells,.e-vertical-view .e-date-header-wrap .e-header-cells')) {

      console.log(args);

    }

  }

 

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

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

      <div className='control-wrapper'>

        <ScheduleComponent popupOpen={onPopupOpen}>

        </ScheduleComponent>

      </div>

    </div>

  </div>);

}

export default LocalData;

Q2: swipe-to-select cells:

According to the current Schedule architecture, we don’t have a swipe to select cells support. Can you share more details about your query like a video demo showing your described behavior it will help us to provide the solution for your query earlier?

Regards,

Vijay Ravi

[Aletia Trakakis]

<schedulecomponent select={(event) => {

        if (event.data && event.requestType === "cellSelect") {

            //TODO: use 'event.data'

        }

    }

}}

</schedulecomponent>

 

This 'select' function gets called when a user selects and then slides over the empty cells. 'event.data' provides the startTime and endTime of the selected slots. This is working fine on web, but its not working when i run it on mobile(both iOS and andorid).

Behavior on mobile:
When I try to select and swipe, it fires the 'select' function once on touch-down.

Behavior on mobile I want:
What I want is to select cells when swipe while selected, and then when I touchup, then 'select' function should fire again with the startTime and endTime of the seelcted slots.

[Vijay Ravi]

Hi Aletia,

We regret to let you know that according to the current Schedule architecture in mobile devices, we don’t have a swipe to select cells support. Let us know if you need any further assistance.

Regards,

Vijay Ravi