DayPilot.Month.onEventMove

The onEventMove event handler fires when the user drops an event at a target location in the monthly calendar, before the default action configured by DayPilot.Month.eventMoveHandling. See also event moving.

Declaration

DayPilot.Month.onEventMove(args)

Parameters

• args.control (DayPilot.Month) - control instance

• args.e (DayPilot.Event) - the event being moved

• args.newStart (DayPilot.Date) - the new event start

• args.newEnd (DayPilot.Date) - the new event end

• args.ctrl (boolean) - state of the Ctrl key on drop

• args.meta (boolean) - state of the Meta key on drop (available since 2023.3.5604)

• args.shift (boolean) - state of the Shift key on drop

• args.position (number) - target vertical position of the event within a cell in the cell stacking mode (Pro only)

• args.external (boolean) - indicates that the event was dragged from an external source (Pro only)

• args.preventDefault() - cancels the default action

Notes

Use args.preventDefault() to block the move before DayPilot.Month.onEventMoved is fired.

In DayPilot.Month.api = 1 mode, the legacy signature is onEventMove(e, newStart, newEnd, ctrl, shift, position) and this event is called only if DayPilot.Month.eventMoveHandling is set to "JavaScript". The legacy position argument is used when .moveToPosition is enabled.

Examples

JavaScript

const month = new DayPilot.Month("dp", {
  onEventMove: (args) => {
    if (args.newStart > DayPilot.Date.today()) {
      args.preventDefault();
      args.control.message("Moving events to the future not allowed");
    }
  },
  // ...
});
month.init();

Angular

<daypilot-month [config]="config"></daypilot-month>

config: DayPilot.MonthConfig = {
  onEventMove: (args) => {
    if (args.newStart > DayPilot.Date.today()) {
      args.preventDefault();
      args.control.message("Moving events to the future not allowed");
    }
  },
  // ...
};

React

<DayPilotMonth
  onEventMove={onEventMove}
  {/* ... */}
/>

const onEventMove = (args) => {
  if (args.newStart > DayPilot.Date.today()) {
    args.preventDefault();
    args.control.message("Moving events to the future not allowed");
  }
};

Vue

<DayPilotMonth
  @eventMove="onEventMove"
  <!-- ... -->
/>

const onEventMove = (args) => {
  if (args.newStart > DayPilot.Date.today()) {
    args.preventDefault();
    args.control.message("Moving events to the future not allowed");
  }
};

See Also

Event Moving [doc.daypilot.org]

DayPilot.Month.onEventMoved

DayPilot.Month.eventMoveHandling

DayPilot.Month.api

DayPilot.Month Class