The onBeforeEventDomAdd event handler runs before a Scheduler event’s custom DOM content is added. Assign custom content to args.element to replace the event text.

Declaration

DayPilot.Scheduler.onBeforeEventDomAdd(args)

Parameters

  • args.control (DayPilot.Scheduler, read-only): the Scheduler instance.

  • args.e (DayPilot.Event, read-only): the rendered event.

  • args.element: custom DOM element, React element or Vue content supported by the corresponding wrapper.

Notes

Custom content supports floating labels in Lite since version 2026.4.895 and Pro since version 2026.4.7086. Angular event templates are available in Lite since version 2026.4.895 and Pro since version 2026.4.7099. Moving between normal and floating positions preserves the content and its current state. Store values that must survive redraws or navigation in application state.

Example

This JavaScript example uses a DOM element and assigns event text safely using textContent.

const dp = new DayPilot.Scheduler("dp", {
  onBeforeEventDomAdd: args => {
    const label = document.createElement("span");
    label.textContent = args.e.text();
    args.element = label;
  }
});
dp.init();

For Angular content, use an Angular event template. See Floating Events for interactive examples in each framework.

See Also

Floating Events

onBeforeEventDomRemove

Availability

Availability of this API item in DayPilot editions:

ProductLitePro
DayPilot for JavaScript