DayPilot.Scheduler.onBeforeEventExport

The onBeforeEventExport event handler fires during Excel and image export (JPEG, PNG, SVG) and direct printing. It lets you customize the appearance of Scheduler events in the exported output, for example by providing alternative text because image export doesn't support HTML in event boxes.

Declaration

DayPilot.Scheduler.onBeforeEventExport(args)

Parameters

• args.areas (array) - active areas to be included in the exported image; includes areas already defined in the data source and in onBeforeEventRender

• args.barHeight (number) - event bar height

• args.e (DayPilot.Event) - exported event (read-only)

• args.backColor (string) - background color

• args.borderColor (string) - border color

• args.fontSize (string) - font size

• args.fontFamily (string) - font family

• args.fontStyle ("normal" | "bold") - font style

• args.fontColor (string) - font color

• args.format (string) - target format set using DayPilot.Scheduler.exportAs() (read-only)

• args.horizontalAlignment ("left" | "center" | "right") - horizontal text alignment

• args.text (string) - exported text

• args.textLeft (string) - text displayed on the left side

• args.textPadding (number) - text padding

• args.textRight (string) - text displayed on the right side

• args.verticalAlignment ("top" | "center" | "bottom") - vertical text alignment

Notes

Use this event when the exported representation needs to differ from the interactive Scheduler view. Because exported event boxes don't render HTML, set args.text to a plain-text alternative when the on-screen event uses rich HTML content.

Examples

JavaScript

const dp = new DayPilot.Scheduler("dp", {
  onBeforeEventExport: (args) => {
    args.text = args.e.data.html.replace("<br>", "\n");
  },
  // ...
});
dp.init();

Angular

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

config: DayPilot.SchedulerConfig = {
  onBeforeEventExport: (args) => {
    args.text = args.e.data.html.replace("<br>", "\n");
  },
  // ...
};

React

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

const onBeforeEventExport = (args) => {
  args.text = args.e.data.html.replace("<br>", "\n");
};

Vue

<DayPilotScheduler
  @beforeEventExport="onBeforeEventExport"
  <!-- ... -->
/>

const onBeforeEventExport = (args) => {
  args.text = args.e.data.html.replace("<br>", "\n");
};

See Also

DayPilot.Scheduler.exportAs()

Client-Side Export [doc.daypilot.org]

DayPilot.Scheduler Class