Modify dhtmlxGantt to work with multiple projects - Laravel5

Question

I have integrated dhtmlxGantt in a Laravel5 project and everything is working as expected. But I want to modify it to store charts for more than one project. For that I want to add extra field called "project_id" and load data through a filter.

I have tried modifying the Controller with the following code :

$connector->render_links(                                  
    GanttLink::where('user_id', '=', 1)->get(),
    "id", 
    "source,target,type"                
);

$connector->render_table(                                  
    GanttTask::where('user_id', '=', 1)->get(),
    "id",                                                               
    "start_date,duration,text,progress,parent"                      
);

This solution allowed me to load the chart from the data base in the way I wanted. But It does not save the changes back to the database. I went through the dhtmlxGantt documentations but did not get any solution for this.

I found these links in my research and might be helpful.

Link 1: Changing values before saving

Link 2: Filtering results based on a parameter

Please help me to modify my project in a way which allows to work (Load and Edit) on different charts.

Answer 1

Finally I found a solution. Firstly, you need to add project_id column to the database table, then add the column to connector configuration:

$connector->render_table(new GanttTask(), "id", "start_date,duration,text,progress,parent,project_id");

Then you have to do some modifications to the client-side code. Use something like,

var project_id = "<?php echo $project['id']; ?>";

in order to take the variable into the <script>..</script> Then modify your code by adding these two client-side handlers:

gantt.attachEvent("onBeforeTaskDisplay", function (id, task) {
                            if (task.project_id == project_id) {
                                return true;
                            }
                            return false;
                        });

and

gantt.attachEvent("onBeforeTaskAdd", function (id, task) {
                            task.project_id = project_id;
                        });

First handler filters the results in the way you want before displaying the chart, and second handler attaches the project_id property before adding the task. Now you have a dhtmlxGatt which can display multiple projects.