Daypilot Scheduler - Bubble shown on different page

Asked by Jason
3 years ago.

Hi,

I'm using the DayPilotSchedulerComponent for Angular, and I'm showing cellbubble like this :

cellBubble: new DayPilot.Bubble({
    animated: false,
    showAfter: 0,
    showLoadingLabel: false,
    onLoad: (bubble: SchedulerCellBubble) => {
        const cell = bubble.source;
        if (this.isBookedCell(cell)) {
            bubble.html = 'Ajouter une instruction';
        }
    }
})

The problem is when the user go to an other page (without daypilot scheduler), if a bubble was visible on the scheduler, it's still visible on the other page for few seconds.

Is there a way to destroy the scheduler/bubbles (when using DayPilotSchedulerComponent) ?

how-to javascript

bubble-still-visible.jpg

Answer posted by Dan Letecky [DayPilot]
3 years ago.

There is a static DayPilot.Bubble.hide() method that will hide the current bubble immediately:

https://api.daypilot.org/daypilot-bubble-hide/

Comment posted by Jason
3 years ago.

Thank you for your responsiveness !

It works, I called it in the onDestroy of my component with a delay (without delay the bubble seems to be recreated) :

ngOnDestroy() {
setTimeout(() => {
DayPilot.Bubble.hide();
}, 100);
}

This question is more than 1 months old and has been closed. Please create a new question if you have anything to add.

Daypilot Scheduler - Bubble shown on different page

Products

Learn

Get Support

DayPilot Pro