DayPilot.Gantt.contextMenuTask

The contextMenuTask property (DayPilot.Menu) sets the context menu displayed for task boxes in the Gantt chart.

Declaration

DayPilot.Gantt.contextMenuTask

Default Value

null

Notes

Assign a DayPilot.Menu instance to define the commands available when the user opens the task box context menu.

The menu item handlers can inspect the clicked task using args.source, including the task ID from args.source.id(), and call task API methods such as gantt.tasks.remove(args.source).

Examples

JavaScript

const taskMenu = new DayPilot.Menu({
  items: [
    {
      text: "Show task ID",
      onClick: args => {
        alert("Task ID: " + args.source.id());
      }
    },
    {
      text: "Delete task",
      onClick: args => {
        gantt.tasks.remove(args.source);
      }
    }
  ]
});

const gantt = new DayPilot.Gantt("dp", {
  contextMenuTask: taskMenu,
  // ...
});
gantt.init();

Angular

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

taskMenu = new DayPilot.Menu({
  items: [
    {
      text: "Show task ID",
      onClick: args => {
        alert("Task ID: " + args.source.id());
      }
    },
    {
      text: "Delete task",
      onClick: args => {
        this.gantt.control.tasks.remove(args.source);
      }
    }
  ]
});

config: DayPilot.GanttConfig = {
  contextMenuTask: this.taskMenu,
  // ...
};

React

<DayPilotGantt
  contextMenuTask={contextMenuTask}
  {/* ... */}
/>

const contextMenuTask = new DayPilot.Menu({
  items: [
    {
      text: "Show task ID",
      onClick: args => {
        alert("Task ID: " + args.source.id());
      }
    },
    {
      text: "Delete task",
      onClick: args => {
        gantt.tasks.remove(args.source);
      }
    }
  ]
});

Vue

<DayPilotGantt
  :contextMenuTask="contextMenuTask"
  <!-- ... -->
/>

const contextMenuTask = new DayPilot.Menu({
  items: [
    {
      text: "Show task ID",
      onClick: args => {
        alert("Task ID: " + args.source.id());
      }
    },
    {
      text: "Delete task",
      onClick: args => {
        gantt.tasks.remove(args.source);
      }
    }
  ]
});

See Also

DayPilot.Menu Class

DayPilot.Gantt.contextMenuRow

DayPilot.Gantt.contextMenuLink

DayPilot.Gantt Class