Refresh page link display error

Hey, guys

I used 7.0.11 pro, ts, and vue3

I use the data from the instance to run in my local code
Classic Look (dhtmlx.com)

For example, task # 2.2

Screenshot in the example, starting from April 6, 2023

In my code
When I first refreshed the page and loaded it, the start time of Task # 2.2 changed to April 5th, 2023, but the actual data used was April 6th, 2023

When I switched the menu and returned here, the start time of Task # 2.2 changed to April 6, 2023, which became correct

So the problem is that the same code and data are displayed incorrectly when I refresh the browser, and switching menu refresh is correct. And I found that when I remove links, the timeline display is also correct, even if I refresh the browser.

Can you analyze what caused the problem and how can I solve it?

Hello,
I suppose, you enabled auto-scheduling, so it is expected that Task #2.2 has a different date.
You can reproduce that in the following snippets:
https://snippet.dhtmlx.com/0ciyjowo
https://snippet.dhtmlx.com/dwe6tzef

You need to disable the auto_scheduling config if you don’t want to use that functionality:
https://docs.dhtmlx.com/gantt/api__gantt_auto_scheduling_config.html
Or you can disable the auto_scheduling_initial config, if you want to auto-schedule tasks, but not right after loading them:
https://docs.dhtmlx.com/gantt/api__gantt_auto_scheduling_initial_config.html

You can read about auto-scheduling in the following article:
https://docs.dhtmlx.com/gantt/desktop__auto_scheduling.html

Also, if you get different data when you switch tabs, it means that you don’t use the Gantt Instance approach, so Gantt loads the data and configuration again when you switch to the tab with Gantt.
If you use Gantt in Angular, React, Vue, or other framework related to node.js, it is expected to use the Gantt Instance approach.

When you open a page/tab/view with Gantt, you need to create a new Gantt instance. When you switch to a different page/tab/view, you need to destroy the Gantt instance:
https://docs.dhtmlx.com/gantt/desktop__multiple_gantts.html#destructorofganttanddataprocessorinstances

Alternatively, you need to manually reset everything by yourself.
The following article covers the known issues:
https://docs.dhtmlx.com/gantt/desktop__gantt_instance.html

Here is the demo:
https://files.dhtmlx.com/30d/4f25d33cbc4b19057f40a028577f9410/vue3+gantt-instance+trial_7.1.12.zip

If that doesn’t help you, probably, the issue is related to the Gantt configuration, but it is hard to suggest what might be wrong as I don’t see your code.
Please send me a ready demo with all the necessary JavaScript and CSS files so that I can reproduce the issue locally.

Oh, thank you very much for your answer. Based on your prompt, I checked my code and found that it was indeed caused by auto scheduling. I will adjust my code based on the examples you provided. Thank you for your timely response!

1 Like