DayPilot.Scheduler.registerDropTarget

The registerDropTarget() method allows registering an external element (typically a list of unscheduled events) as a drop target for Scheduler events. This will allow dragging events from a Scheduler (with dragOutAllowed property set to true) to this element.

This method is static. It has to be executed using the full prefix (not on a DayPilot.Scheduler class instance).

Available since 2021.2.4931.

Declaration

DayPilot.Scheduler.registerDropTarget(options);

Parameters

• options.element (DOM element) - the element to be activated for drag and drop

• options.onDragLeave - event handler that will be fired when the source event is moved outside of the target; optional

• options.onDragOver - event handler that will be fired continuously when the source event is being moved over the target; optional

• options.onDrop - event handler that will be fired on drop; optional

The event handlers will receive an args parameter with the following properties:

• args.e - source event (DayPilot.Event)

See Also

• DayPilot.Scheduler.makeDraggable()

Example

DayPilot.Scheduler.registerDropTarget({
    element: document.getElementById("queue"),
    onDrop: args => {
        const parent = document.getElementById("external");
        const li = document.createElement("li");
        li.setAttribute("data-duration", args.e.duration().totalHours());
        li.setAttribute("data-id", args.e.id());
        li.style.cursor = "move";
        li.innerText = args.e.text();
        parent.appendChild(li);

        makeDraggable();

        dp.events.remove(args.e);
    },
});