DayPilot.Gantt.onRowMoving

The onRowMoving event handler fires in the JavaScript Gantt Chart during drag and drop row moving, whenever the current target position changes.

You can use this event to implement custom rules for row moving before the drop is completed.

Declaration

DayPilot.Gantt.onRowMoving(args)

Parameters

• args.source (DayPilot.Task) - source task being moved

• args.target (DayPilot.Task) - current target task under the pointer

• args.position ("child" | "before" | "after" | "forbidden") - current drop position relative to the target task; set it to "forbidden" to block the current target position

Notes

This event fires repeatedly while the user is dragging a row. Update args.position to "forbidden" when you want to reject the current drop target.

Examples

JavaScript

const gantt = new DayPilot.Gantt("dp", {
  onRowMoving: (args) => {
    if (args.target.type() === "Milestone" && args.position === "child") {
      args.position = "forbidden";
    }
  },
  // ...
});
gantt.init();

Angular

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

config: DayPilot.GanttConfig = {
  onRowMoving: (args) => {
    if (args.target.type() === "Milestone" && args.position === "child") {
      args.position = "forbidden";
    }
  },
  // ...
};

React

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

const onRowMoving = (args) => {
  if (args.target.type() === "Milestone" && args.position === "child") {
    args.position = "forbidden";
  }
};

Vue

<DayPilotGantt
  @rowMoving="onRowMoving"
  <!-- ... -->
/>

const onRowMoving = (args) => {
  if (args.target.type() === "Milestone" && args.position === "child") {
    args.position = "forbidden";
  }
};

See Also

DayPilot.Gantt.onRowMove

DayPilot.Gantt.onRowMoved

DayPilot.Gantt Class