DayPilot.Calendar.moveBy

The moveBy property (string) sets the default event drag handle position used by the JavaScript Calendar component for moving and resizing.

Declaration

DayPilot.Calendar.moveBy

Possible Values

• "Disabled" - equals to "None" (backwards compatibility)

• "Full" - start dragging anywhere inside the event and use the right edge as the resizing handle.

• "Left" - uses the left edge as the moving handle and the right edge as the resizing handle.

• "None" - no built-in drag handles are shown.

• "Top" - uses the top edge as the moving handle and the left/right edges as the resizing handles.

Default Value

"Full"

Notes

If you use "None", you can define a custom drag handle using event active areas.

Examples

JavaScript

const calendar = new DayPilot.Calendar("dp", {
  moveBy: "Top",
  // ...
});
calendar.init();

Angular

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

config: DayPilot.CalendarConfig = {
  moveBy: "Top",
  // ...
};

React

<DayPilotCalendar
  moveBy="Top"
  {/* ... */}
/>

Vue

<DayPilotCalendar
  moveBy="Top"
  <!-- ... -->
/>

See Also

Event Moving [doc.daypilot.org]

Event Resizing [doc.daypilot.org]

Event Drag Handles [doc.daypilot.org]

DayPilot.Calendar Class