[INFO REQ] Is it possible to load tasks not from a file?

[tempuser1337]

All the examples utilise `projectmodel transport`, but I'm doing transformations on my data before I'm passing it to my gantt, so it can't come from a public URL. Can you provide a small example / point me to a resource?

[mats]

We use static data for our demos for simplicity. You should read our guides

https://bryntum.com/docs/gantt/#guides/project_data.md
https://bryntum.com/docs/gantt/#guides/crud_manager.md

Also see the PHP demo in the examples folder

[spodeopieter2]

I am facing a similar challenge.
Check out this page:

https://bryntum.com/docs/gantt/#guides/getting_started.md

It is a quick and dirty solution in my opinion , but you can specify event data this way.

const project = new bryntum.gantt.ProjectModel({
    startDate  : '2017-01-01',

    eventsData : [
        { id : 1, name : 'Proof-read docs', startDate : '2017-01-02', endDate : '2017-01-09' },
        { id : 2, name : 'Release docs', startDate : '2017-01-09', endDate : '2017-01-10' }
    ],

    dependenciesData : [
        { fromEvent : 1, toEvent : 2 }
    ]
});

[mats]

I am facing a similar challenge.

What exactly is the challenge? Did you read our guides?

[spodeopieter2]

I have read the 3 guides mentioned above. Perhaps I am just stupid and reading them incorrectly.
But I am planning on reading more guides and diving into the documentation in the future.

The challenge/problem in my case is that the server I am getting my data from is providing a output that can't be loaded by the built in fetch function. I need to parse it client side so that it has the correct format before I can "load" it.

I haven't put much effort into understanding the whole project store system at this moment , perhaps after doing that I will have a better picture, personally I am not finding the documentation very easy to read , but as I said that might just be me being stupid , so I will get back to you once I start going more into depth.

[mats]

Ok understood. If you cannot load data the way we have documented, you can always fall back to the inline way suggested above.

[spodeopieter2]

Just to be clear again , as far as I understand , in my situation I cannot load the data using the load function , because I have to transform the data I fetch from an API.

the server I have to use provides the following output for tasks :

[
{"D_ID":1,
"Name":"xyz",
"Relates_To":"123",
"Start_Date":"2016-07-31T00:00:00",
"End_Date":null,
"D_KeyDate":1},
{"D_ID":2,
"Name":"abc",
"Relates_To":"123",
"Start_Date":"2016-07-31T00:00:00",
"End_Date":null,
"D_KeyDate":1}
]

so at the moment I am doing the following in order to import the data

let apiData = [] // <-- Above mentioned array

      await apiData.forEach(element => {
      element.id = element.D_ID;
      element.name = element.Name;
      element.startDate = moment(element.Start_Date).format(
        "YYYY-MM-DD[T00:00:00]"
      );
      element.endDate =
        element.End_Date == null
          ? moment(element.Start_Date)
              .add(5, "days")
              .format("YYYY-MM-DD[T00:00:00]")
          : moment(element.End_Date).format("YYYY-MM-DD[T00:00:00]");
      console.log(element);
    });

    const insertRecords = () => {
      const taskStore = ganttConfig.project.taskStore;
      taskStore.insert(0, apiData);
      console.log(taskStore.records);
    };

    await insertRecords();

Is this the right way to do this ? Is there a better way to do this ? am I missing something ?

note:
The inline rending method mentioned above is giving me some problems. It is rendering all tasks with the same start date, not sure if this is because I am using react hooks , or for some other reason ?

[sergey.maltsev]

Hi!

Could please check if info from topic here help you to customize date format for client/sever protocol?
viewtopic.php?f=44&t=13303&p=69246#p69246

[spodeopieter2]

Thanks so much I checked this out , but I am still confused as to how solve my problem correctly. My problem is. that I have to interface with a server that gives me data in the following way:


This is how I query the server:

    
    let apiData = [];

    await axios
      .get(
        "https://notrevealingendpoint",
        config
      )
      .then(async response => {
        apiData = await response.data;
      })
      .catch(console.log);
 

after executing this apiData equals the following:

[
{"D_ID":1,
"Name":"xyz",
"Relates_To":"123",
"Start_Date":"2016-07-31T00:00:00",
"End_Date":null,
"D_KeyDate":1},
{"D_ID":2,
"Name":"abc",
"Relates_To":"123",
"Start_Date":"2016-07-31T00:00:00",
"End_Date":null,
"D_KeyDate":1}
]

how do I "load" these tasks correctly ?

*due to circumstances I cannot get the server to return a json object that looks like launch-saas.json

I have trouble using the insert method mentioned above, it seems to be very fragile , when I start changing the above code to import at a different time , sometimes the tasks get rendered all with the exact same start date.

[sergey.maltsev]

Hi!

Please make a simple demo with your data which we can launch here and test.
It would be much easier to help you then.

https://www.bryntum.com/docs/gantt/#Core/helper/AjaxHelper could be used to load data in your format from local resource file (make dump from server to file) before you process it to Gantt.