Nativescript-ui-feedback: Close selected day in Nativescript RadCalendar

Created on 25 Jul 2019  路  2Comments  路  Source: ProgressNS/nativescript-ui-feedback

In my Nativescript + Angular application I'm using RadCalendar component. I have a custom button that go to current day. With an android phone I have an issue: if I swipe 2 months and click a day cell, it opens a section with the list of events. But when I click my custom button to go back to current day, the section with events is still open. I'm trying to force closing that but the following code doesn't work.

HTML:

<ActionItem (tap)="onGoToDateTap()" verticalAlignment="center"
        horizontalAlignment="center">
        <Label height="25" class="link text-uppercase cold" color="#000000" text="Now"></Label>
</ActionItem>
    ... 
<RadCalendar [eventSource]="calendarEvents" id="calendar" #calendar (inlineEventSelected)="inlineEventSelected($event)"
    (navigatingToDateStarted)="onNavigatingToDateStarted($event)" locale="en-EN" viewMode="month" eventsViewMode="Inline">
</RadCalendar>

Typescript:

    onGoToDateTap() {
        this.calendar.nativeElement.selectedDate = undefined;
        this.calendar.nativeElement.resetNativeView();
        this.calendar.nativeElement.reload();
        const date = new Date();
        setTimeout(() => {
            this.calendar.nativeElement.goToDate(date);
            this.cdr.detectChanges();
        }, 400)
    }
calendar needs more info

Most helpful comment

@tsonevn thank you for you answer! The problem is just for some particular type of phones indeed. But I found the solution to force the closing of the cell:
this.calendar.nativeElement.nativeView.eventsManager().closeEvents();

All 2 comments

Hi @panagulis72,
I reviewed the described case, however, was unable to recreate a similar problem. For your convenience, I am attaching my test project, please review it and make the needed changes that will allow us to reproduce the problem.

@tsonevn thank you for you answer! The problem is just for some particular type of phones indeed. But I found the solution to force the closing of the cell:
this.calendar.nativeElement.nativeView.eventsManager().closeEvents();

Was this page helpful?
0 / 5 - 0 ratings