DayPilot.Scheduler.onEventEditKeyDown

The onEventEditKeyDown event handler fires when a keydown event is detected during inline event editing.

Available since version 2021.3.5073.

Declaration

DayPilot.Scheduler.onEventEditKeyDown(args)

Parameters

• args.e (DayPilot.Event) - the active event

• args.cancel() - cancels the editing without applying changes, equal to hitting <escape>

• args.element - the <textarea> element used for editing

• args.originalEvent - the original KeyboardEvent object

• args.preventDefault() - cancels the default action defined for <escape> and <enter>

• args.submit() - submits the changes, equal to hitting <enter>

Notes

Use args.preventDefault() if you need to suppress the built-in handling of <escape> or <enter> and decide explicitly whether to call args.cancel() or args.submit().

Examples

JavaScript

const dp = new DayPilot.Scheduler("dp", {
  onEventEditKeyDown: (args) => {
    if (args.originalEvent.key === "Enter" && !args.element.value.trim()) {
      args.preventDefault();
    }
  },
  // ...
});
dp.init();

Angular

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

config: DayPilot.SchedulerConfig = {
  onEventEditKeyDown: (args) => {
    if (args.originalEvent.key === "Enter" && !args.element.value.trim()) {
      args.preventDefault();
    }
  },
  // ...
};

React

<DayPilotScheduler
  onEventEditKeyDown={onEventEditKeyDown}
  {/* ... */}
/>

const onEventEditKeyDown = (args) => {
  if (args.originalEvent.key === "Enter" && !args.element.value.trim()) {
    args.preventDefault();
  }
};

Vue

<DayPilotScheduler
  @eventEditKeyDown="onEventEditKeyDown"
  <!-- ... -->
/>

const onEventEditKeyDown = (args) => {
  if (args.originalEvent.key === "Enter" && !args.element.value.trim()) {
    args.preventDefault();
  }
};

See Also

Inline Event Editing [doc.daypilot.org]

DayPilot.Scheduler.onEventEdit

DayPilot.Scheduler.eventEditHandling

DayPilot.Scheduler Class