DayPilot.Scheduler.contextMenu

The contextMenu property (DayPilot.Menu) specifies the context menu used for JavaScript Scheduler events.

Declaration

DayPilot.Scheduler.contextMenu

Default Value

null

Notes

Assign a DayPilot.Menu instance to define the available menu commands and their click handlers for event context menus.

Examples

JavaScript

const dp = new DayPilot.Scheduler("dp", {
  contextMenu: new DayPilot.Menu({
    items: [
      { text: "Show event ID", onClick: args => alert("Event ID: " + args.source.data.id) },
      { text: "Show event text", onClick: args => alert("Event text: " + args.source.text()) },
      { text: "Show event start", onClick: args => alert("Event start: " + args.source.start()) },
      { text: "Delete this event", onClick: args => dp.events.remove(args.source) }
    ]
  }),
  // ...
});
dp.init();

Angular

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

menu = new DayPilot.Menu({
  items: [
    { text: "Show event ID", onClick: args => alert("Event ID: " + args.source.data.id) },
    // ...
  ]
});

config: DayPilot.SchedulerConfig = {
  contextMenu: this.menu,
  // ...
};

React

<DayPilotScheduler
  contextMenu={menu}
  {/* ... */}
/>

const menu = new DayPilot.Menu({
  items: [
    { text: "Show event ID", onClick: args => alert("Event ID: " + args.source.data.id) },
    // ...
  ]
});

Vue

<DayPilotScheduler
  :contextMenu="menu"
  <!-- ... -->
/>

const menu = new DayPilot.Menu({
  items: [
    { text: "Show event ID", onClick: args => alert("Event ID: " + args.source.data.id) },
    // ...
  ]
});

See Also

Event Context Menu [doc.daypilot.org]

DayPilot.Scheduler.contextMenuResource

DayPilot.Scheduler.contextMenuSelection

DayPilot.Scheduler Class