Avoid navigation with fingers on mobile

[Arturo Martinez]

As the tittle says, on mobile i can navigate swiping left and right using the fingers to move between dates, how can i cancel this behavior?

<ejs-schedule

#scheduleObj

width='100%'

cssClass='timeline-resource-grouping'

height='auto'

[selectedDate]="selectedDate"

[group]="group"

[workDays]="workDays"

[eventSettings]="eventSettings"

[timeScale]="timeScale"

[currentView]="currentView"

(actionComplete)="onActionComplete($event)"

(renderCell)="onRenderCell($event)"

(dataBound)="onDataBound()"

(popupOpen)="onPopupOpen($event)"

(dragStart)="onDragStart($event)"

(dragStop)="onDragStop($event)"

(eventRendered)="onEventRendered($event)"

(resizeStop)="onResizeStop($event)"

[quickInfoOnSelectionEnd] = "true"

>

<ng-template #dateHeaderTemplate let-data>

<div class="date-text"></div>

<div [innerHTML]="getDateHeaderText(data.date)"></div>

</ng-template>

<ng-template #resourceHeaderTemplate let-data let-index>

<div style="height: 100%; display: flex; align-items: center; justify-content: start;">

<div [matMenuTriggerFor]="menu" class="btn btn-icon btn-custom btn-icon-muted">

<img class="thumbnail" *ngIf="isChildNode(data)" [src]="getIconClass(data.resourceData.text)" alt="{{data.resourceData.ImageName}}" style="height: 57px; width: 30px;" />

</div>

<mat-menu #menu="matMenu">

<ng-container *ngFor="let estatus of estatusArray">

<button (click)="onStatusChange(data.resourceData.text, estatus.Descripcion)" mat-menu-item>

<span>{{estatus.Descripcion}}</span>

</button>

</ng-container>

</mat-menu>

{{data.resourceData.text}}

</div>

</ng-template>

<e-resources>

<e-resource

field='ProjectId'

title='Choose Project'

[dataSource]='tipoHabGroupDataSource'

[allowMultiple]='allowMultiple'

name='Type'

textField='text'

idField='id'

colorField='color'

>

</e-resource>

<e-resource

field='TaskId'

title='Category'

[dataSource]='habitacionPorTipoDataSource'

[allowMultiple]='allowMultiple'

name='Rooms'

textField='text'

idField='id'

groupIDField='groupId'

colorField='color'

>

</e-resource>

</e-resources>

<e-views>

<e-view option="TimelineDay" [interval]="dayInterval"></e-view>

<e-view option="TimelineWeek"></e-view>

<e-view option="TimelineWorkWeek"></e-view>

<e-view option="TimelineMonth"></e-view>

</e-views>

</ejs-schedule>

[Vijay Ravi]

Hi Arturo,

To meet your requirement, you can set the allowSwiping property of the scheduler to false. This will prevent users from navigating between dates using swipe gestures. Please refer to the API documentation linked below for further details.

allowSwiping api: https://ej2.syncfusion.com/angular/documentation/api/schedule/#allowswiping

Regards,

Vijay