Skip to main content

request-data

Description​

Fires when data for a lazy task branch is requested

Gantt triggers this action only from the open-task action with mode: true, for a task that has lazy: true and no loaded children.

To pass the loaded data to Gantt, use the provide-data action. See also Dynamic data loading.

Usage​

"request-data": ({
  id: string | number,
  nested?: boolean
}) => boolean | void;

Parameters​

The callback of the request-data action can take an object with the following parameters:

  • id - (required) the task ID for which data is requested
  • nested - (optional) true if the branch is opened by open-task with nested: true. The handler should load the whole subtree of the task, not only its direct children
info

For handling the actions you can use the Event Bus methods

Example​

import { useState, useEffect } from "react";
import { RestDataProvider } from "@svar-ui/gantt-data-provider";
import { Gantt } from "@svar-ui/react-gantt";
import { Button } from "@svar-ui/react-core";

const restProvider = new RestDataProvider("https://some_backend_url");

export default function App() {
  const [tasks, setTasks] = useState([]);
  const [links, setLinks] = useState([]);
  const [api, setApi] = useState(null);

  useEffect(() => {
    restProvider.getData().then((data) => {
      setTasks(data.tasks);
      setLinks(data.links);
    });
  }, []);

  function init(ganttApi) {
    setApi(ganttApi);
    ganttApi.on("request-data", ({ id, nested }) => {
      console.log(
        "Data request for: " +
          id +
          (nested ? " with nested parameter" : "")
      );
    });
  }

  function expandTask() {
    api.exec("open-task", { id: 1, mode: true, nested: true });
  }

  return (
    <>
      <Button type="primary" onClick={expandTask}>Expand task</Button>
      <Gantt init={init} tasks={tasks} links={links} />
    </>
  );
}

Related sample:

Related articles: