I want to implement infinite scroll in gantt. I want to load 100 rows and when i have scrolled to end to 100 rows i want to load next 100.
I don’t want use existing functionality where i have to write an api which is called by gantt in load method.
Is there a way i can take control of when to fetch data?
Hello Sandeep,
The functionality of the current Gantt version (6.2) allows loading all tasks that you have in the database or a JSON variable.
Because of the smart rendering, you can have 100000 tasks and 100-year scale with the day scale unit. You can generate so many tasks in the following snippet and see how it works:
https://snippet.dhtmlx.com/1120eaa52
If you want to detect that the user has scrolled to the bottom of the Gantt container, you can implement a custom solution. Here is an example of how it might work:
http://snippet.dhtmlx.com/5/1ced5a001
You can use the gantt.parse()
command to load more tasks:
https://docs.dhtmlx.com/gantt/api__gantt_parse.html
If that doesn’t help you, please give me a detailed description of your requirement and of how you imagine it should work.
Hello,
I didn’t promise that the infinite scroll will work in the snippet (and that wasn’t the original question). I added the code that will help to know that the user scrolled the page to the bottom, and it is used to load new tasks.
If you want to drag a task horizontally and extend the timeline, you need to call the gantt.render()
function when the task is near the timeline border:
Here is an example of how it might be implemented:
https://snippet.dhtmlx.com/2dab5036e
If you specified the date range and want to extend it, you need to make it work in a different way.
Here is an example of how it might be implemented:
http://snippet.dhtmlx.com/5/63bd3da07
If you need something different, please, give me more details about your requirement.
Can we disable this feature?
Hello Patels,
As this is not a built-in feature, how do you imagine you can disable it?
If you manually implemented that, you can add a variable to change how it works:
http://snippet.dhtmlx.com/5/8f6c8518f