Schedule and Gantt

[Silvano Pisoni]

Good morning everyone, I'm writing to ask for help. I'm trying to create an application with syncfusion that manages and synchronizes the two Schedule and Gantt components.

Has anyone done something similar? Is it possible in your opinion?

Thank you

[Ajithkumar Gopalakrishnan]

Hi Silvano,

Greetings from Syncfusion Support,

Yes, it is possible on our end. Before we proceed, we need the following information:
            

• Which platform do you need the sample for (e.g., EJ2 or Blazor)?
• If EJ2, please specify the platform (e.g., React, Angular, etc.)
• In which form do you want to Synchronize(while scrolling or datasource)
• Detailed Explanation of your requirement.

Once we have this information, we will provide the necessary details and sample based on your requirements.

Regards,
Ajithkumar G

[Silvano Pisoni]

Hi  Ajithkumar,

• Which platform do you need the sample for (e.g., EJ2 or Blazor)?
• If EJ2, please specify the platform (e.g., React, Angular, etc.)

ej2-react-gantt and ej2-react-schedule

• In which form do you want to Synchronize(while scrolling or datasource



I don't know if I understood the question correctly. my operation would be this:

I have a mysql database from which I query the orders and collaborators of my studio. I can save the orders associated with a collaborator and the colors of the order on a sqllite db.

When I select the collaborators and the jobs I load the events (from the same sqllite db) and I should see them on the scheduler and on the gantt.

By modifying the gantt and the scheduler the events saved on the sqlite db should also be updated.

I tried a draft project but it doesn't work with syncs... I think I made it much more complex than it could be done.

If there was a demo of how gantt and scheduler can work together it would be great.

Thank you

Attachment: TERA_GESTIONALE_DB_9eb46d0b.zip

[Ajithkumar Gopalakrishnan]

Hi Silvano,

Further validating, we are unable to run your shared sample on our end because we don't have the necessary database connection service. If possible, provide a runnable sample for validation. Meanwhile, we will prepare a sample demonstrating the synchronization of the Gantt chart with the scheduler component using CRUD actions through an adaptor. We will share the sample on or before Oct 9, 2024.

Regards,
Ajithkumar G

[Silvano Pisoni]

Hi,

Can you explain me better? can't connect to mysql db? can you explain me better

 What can't you connect to?

[Ajithkumar Gopalakrishnan]

Hi Silvano,

The previously shared sample was successfully run locally without any issues. After running the sample alongside the node server, the data was properly rendered in the Gantt chart. However, the Schedule component did not display because the resource was not added, and even after the resource was added, the event was not shown in the Schedule component. Additionally, any changes made in the Gantt chart were not reflected in the Schedule component. We will investigate and share the details by October 9, 2024.

Regards,
Ajithkumar G

[Ajithkumar Gopalakrishnan]

Hi Silvano,

We appreciate your patience.

Gantt Chart Validation Details:

We have verified the shared sample, where changes to the dataSource are not reflected in the Gantt chart UI. To resolve this issue, we suggest using the key property in React. This property is used to re-render the Gantt chart with the updated dataSource.

<GanttComponent

      key={filteredData}

      ...

    >

      ...

</GanttComponent>

Although the dataSource is updated in the Gantt chart, it is not reflecting valid data. We have attached an image for reference. Please ensure that certain required fields are updated in the Gantt chart. For example, if the TaskId field is empty (which is a primary key), CRUD actions in the Gantt chart will not work correctly. Ensure that a valid dataSource is provided.

Image ref:



For more information, you may refer to the following link:

Editing tasks in React Gantt component | Syncfusion

Scheduler Component Validation Details:

Initially, the scheduler component is showing an empty page because the group property is used in your sample. In this case, if no resource is provided, an empty condition needs to be handled in the sample. We observed that the eventsData does not correctly include the StartTime, EndTime, or Resource field IDs, which results in events not being displayed correctly. To resolve this, please ensure that the required fields such as StartTime, EndTime, and the Resource field ID are properly set in the scheduler data.

Image ref:



Note: Once valid dataSource updates are made to both components, CRUD actions done in either component will automatically synchronize

Modified sample link: https://www.syncfusion.com/downloads/support/directtrac/general/ze/TERA_GESTIONALE_DB_9eb46d0b2133222198.zip

Regards,
Ajithkumar G