search envelope-o feed check
Home Unanswered Active Tags New Question
user comment-o

How to remove default mousedown event on calendar events?

Asked by RichieRich
10 months ago.

I have a div inside an Event which i will be dragging (using HTML5 drag-drop library) to drop outside the calendar.

So in order to let the 'dragstart' event of HTML5 drag-drop library to work I need to remove 'mousedown' EventListener from the div.calendar-deafault-event. How do I do that?

Answer posted by Dan Letecky [DayPilot]
10 months ago.

It's not possible to remove event handlers from the event div. However, you can handle onAfterEventRender event to get access to the event div and customize it. The event consists of two main <div> elements: they are marked with calendar_default_event (outer div) and calendar_default_event_inner (inner div) CSS classes.

The internal event handlers are defined for the outer div. You can define your own event handlers on the inner div or customize the inner div content. This way your code will be fired before the internal event handlers are processed.

This example will just cancel the mousedown event bubbling. It will be better to define the required functionality directly instead.

config: any = {
  onAfterEventRender: args => {
    let div = args.div;
    let inner = div.firstChild;
    inner.addEventListener("mousedown", function(ev) {
      ev.stopPropagation();
    });
  }
}
Comment posted by RichieRich
10 months ago.
This question is more than 6 months old and has been closed. Please create a new question if you have anything to add.