Skip to main content

delete-link

Description​

Fires when deleting a link

Usage​

"delete-link": ({
   id:  string | number;
   reason?: "cycle" | "parent-chain" | "summary-endpoint";
}) => boolean|void;

Parameters​

The callback of the delete-link action can take an object with the following parameters:

  • id - (required) the ID of a link to be deleted
  • reason - (optional) set when auto scheduling removes an invalid link: "cycle" for a circular link, "parent-chain" for a link between a summary task and its own child task, "summary-endpoint" for a link from the start or to the end of a summary task | PRO feature
info

For handling the actions you can use the Event Bus methods. Returning false from the action handler will block the action (see Preventing actions)

Example​

<script setup>
  import { getData } from "./common/data";
  import { Gantt } from "@svar-ui/vue-gantt";
  
  const data = getData();
  
  function init(api){
   api.on("delete-link", ev => {
    console.log("The id of the deleted link:", ev.id);
   });
  }
</script>

<template>
  <Gantt
    :tasks="data.tasks"
    :links="data.links"
    :init="init"
  />
</template>

You can intercept the action and return false to block it:

api.intercept("delete-link", ev => {
  if (!allowDelete) return false; // prevents deletion
});

Related articles: