yasgun yasgun - 3 months ago 16
Javascript Question

Modify dhtmlxGantt to work with multiple projects - Laravel5

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

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.

Comments