Skip to Content
DocsCalendarPluginsDrag and Drop

Drag and Drop

Update event time and date using a classical drag and drop. Available in all views except the month agenda- and list views.

Install

npm i @schedule-x/drag-and-drop

Usage

import { createDragAndDropPlugin } from '@schedule-x/drag-and-drop' const calendar = createCalendar({ /* other configuration */ plugins: [ createDragAndDropPlugin() ], callbacks: { onEventUpdate(updatedEvent) { console.log('onEventUpdate', updatedEvent) }, // (Optionally) run your validation or side effects // return false to stop the update, and true to allow it onBeforeEventUpdate(oldEvent, newEvent, $app) { return false } } })

Configuration

You can configure the length, in minutes, of the intervals that are used when dragging:

import { createDragAndDropPlugin } from '@schedule-x/drag-and-drop' const calendar = createCalendar({ /* other configuration */ plugins: [ createDragAndDropPlugin(30) // drag with 30 minutes intervals ] })

Available values are 15 (default), 30 and 60

Last updated on

We use cookies for marketing purposes. By clicking "Accept", you consent to the use of all cookies. If you decline, we will only use functional cookies. You can read more about our cookie policy here.