Our powerful JS Calendar component


Post by gustavo.rosendo »

Hi there,

I would like to know if there is a way to trigger a custom event from the event tooltip handler, that would then be consumed in my .vue file.
Something like this:

CalendarConfig.js :

features: {
      eventTooltip : {
        tooltip: {
          tools: {
            // Add a new tool to send a birthday message
            messageTool: {
              cls: 'b-fa-message',
              tooltip: LocaleManager.locale?.EventTooltip?.messageTooltipTitle,
              async handler() {
                this.triggerEvent('sendBirthdayMessage') //==> this is not working!
              }
            }
          }
        }
      }
  }

And then in my .vue file:

CalendarView.vue :

<template>
    <div class="calendar-section">
      <bryntum-calendar
          ref="calendar"
          v-bind="calendarConfig"
          :events="events"
          :resources="resources"
          @sendBirthdayMessage="sendBirthdayMessage"
      />
    </div>
</template>
...
methods: {
    sendBirthdayMessage () {
      console.log('sendBirthdayMessage')
    }
}

Post by Animal »

It does work. That will trigger an event.

But for anything to happen, you have to listen for that event on the Tool. It is the Tool which you are running that handler in.

Try using

handler : 'up.methodOnCalendar'

Like in the examples, and implement the method on the Calendar instance. Then when you call this.trigger, it will be the Calendar that is firing the event, and that's where you added your listener.


Post Reply