We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How I can retrieve the updated values?

Thread ID:

Created:

Updated:

Platform:

Replies:

124748 Jun 27,2016 03:13 PM UTC Jul 4,2016 09:27 AM UTC JavaScript 6
loading
Tags: ejGantt
giorgio
Asked On June 27, 2016 03:13 PM UTC

HI, working on Javascript Gantt version, I would like to know how to retrieve the updated values after made some changes in the editor.
Also I would provide an external json file with values, (gantt.json) something like this:

     //DATA SOURCE DECLARATION OF GANTT CONTROL
        var data = [
             {
                 "TaskID": 1,
                 "TaskName": "Parent Task 1",
                 "StartDate": "02/23/2014",
                 "EndDate": "02/27/2014",
                 "Progress": "40",
                 "Children": [
                      { "TaskID": 2, "TaskName": "Child Task 1", "StartDate": "02/23/2014", "EndDate": "02/27/2014", "Progress": "40" },
                      { "TaskID": 3, "TaskName": "Child Task 2", "StartDate": "02/23/2014", "EndDate": "02/27/2014", "Progress": "40", },
                      { "TaskID": 4, "TaskName": "Child Task 3", "StartDate": "02/23/2014", "EndDate": "02/27/2014", "Duration": 5, "Progress": "40", }
                 ]
             },
             {
                 "TaskID": 5,
                 "TaskName": "Parent Task 2",
                 "StartDate": "03/14/2014",
                 "EndDate": "03/18/2014",
                 "Progress": "40",
                 "Children": [
                      { "TaskID": 6, "TaskName": "Child Task 1", "StartDate": "03/02/2014", "EndDate": "03/06/2014", "Progress": "40" },
                      { "TaskID": 7, "TaskName": "Child Task 2", "StartDate": "03/02/2014", "EndDate": "03/06/2014", "Progress": "40", },
                      { "TaskID": 8, "TaskName": "Child Task 3", "StartDate": "03/02/2014", "EndDate": "03/06/2014", "Progress": "40", },
                      { "TaskID": 9, "TaskName": "Child Task 4", "StartDate": "03/02/2014", "EndDate": "03/06/2014", "Progress": "40" }
                 ]
             }
]

After I manage some data in the editor, putting some predecessors and changing some durations, the json file will be updated accordingly?
Or How I could retrieve the updated json? So to save it into a database file?

thank you

Jonesherine Stephen [Syncfusion]
Replied On June 28, 2016 12:05 PM UTC

Hi Giorgio, 
Thanks for contacting Syncfusion support. 
In “model.dataSource” we can get the updated JSON records.  
Please find the code snippet below: 
<div id="Ganttcontainer" style="height:450px;width:100%;" /> 
<script type="text/javascript"> 
  $(function () { 
 
            $("#Ganttcontainer").ejGantt({ 
                dataSource: projectData, 
                editSettings: { 
                    allowEditing: true, 
                    allowAdding: true, 
                    allowDeleting: true, 
                    allowIndent: true, 
                    editMode: "cellEditing" 
                }, 
                
            }); 
        }); 
 
        function clickme() { 
            var ganttObj = $("#Ganttcontainer").data("ejGantt"); 
            //To get the Updated Json Records 
            var data = ganttObj.model.dataSource; 
            //To alert the Updated JSON data 
            alert(JSON.stringify(ganttObj.model.dataSource)); 
        } 
    </script> 
 
While editing in Gantt the JSON file will not be updated accordingly, we need to do this in server side with updated JSON data value. 
Please find our Knowledge base to update the Gantt Database on add, edit, delete operations below 
We have also prepared the sample based on this. Please find the sample from the below location  
Please let us know if you require further assistance on this.  
Regards             
Jone Sherine .P.S.   


giorgio
Replied On June 29, 2016 01:27 PM UTC

Perfect.

giorgio
Replied On June 29, 2016 02:47 PM UTC

Perfect.

Hi, I have another little problem. I've seen that in the task editor I can enable only the fields I want.

for example
editDialogFields: [{ field: "startDate", editType: "dateedit" }, { field: "endDate", editType: "dateedit" }, { field: "duration", editType: "numericedit" }]

I want to include field 'predecessor', which edittype I must use?
Thanks

Jonesherine Stephen [Syncfusion]
Replied On June 30, 2016 05:47 AM UTC

Hi Giorgio,  
For default fields, default editType will be applied. So no need for declaring editType in those fields 
Please find the code snippet below:  
<div id="Ganttcontainer" style="height:450px;width:100%;" />  
<script type="text/javascript">  
  $(function () {  
  
            $("#Ganttcontainer").ejGantt({  
               dataSource: projectData, 
                predecessorMapping: "predecessor",                 
                editDialogFields: [{ field: "startDate", editType: "dateedit" }, { field:  "endDate", editType: "dateedit" }, { field: "duration", editType: "numericedit" }, { field: "predecessor"}],                
 
            });  
        });  
  
    </script>  
  
We have also prepared the sample for your reference please find the sample from below location 
Please let us know if you require further assistance on this.   
Regards              
Jone Sherine .P.S.   

giorgio
Replied On July 3, 2016 09:32 AM UTC

Hi Giorgio,  
For default fields, default editType will be applied. So no need for declaring editType in those fields 
Please find the code snippet below:  
<div id="Ganttcontainer" style="height:450px;width:100%;" />  
<script type="text/javascript">  
  $(function () {  
  
            $("#Ganttcontainer").ejGantt({  
               dataSource: projectData, 
                predecessorMapping: "predecessor",                 
                editDialogFields: [{ field: "startDate", editType: "dateedit" }, { field:  "endDate", editType: "dateedit" }, { field: "duration", editType: "numericedit" }, { field: "predecessor"}],                
 
            });  
        });  
  
    </script>  
  
We have also prepared the sample for your reference please find the sample from below location 
Please let us know if you require further assistance on this.   
Regards              
Jone Sherine .P.S.   

HI, all works perfect now, but one thing.

When I receive updated gantt info using your routine below,
 
        function clickme() { 
            var ganttObj = $("#Ganttcontainer").data("ejGantt"); 
            //To get the Updated Json Records 
            var data = ganttObj.model.dataSource; 
            //To alert the Updated JSON data 
            alert(JSON.stringify(ganttObj.model.dataSource)); 
        }

I checked that dates are returned as UTC, and this cause problems in conversion. I'm in Italy and all the dates are returned switched by 2 hours (1 legal) as a day before correcting day at one day before at 22.00.
Since I save data to db and thenrestore for visualization in gantt module, all the boundaries will be incorrect.
Could you help me, please?

Thank you,
Giorgio


Attachment: ProjectGantt1_b5070660.zip

Jonesherine Stephen [Syncfusion]
Replied On July 4, 2016 09:27 AM UTC

Hi Giorgio,   
We regret for the inconvenience caused, 
We have prepared the work around and applied the required dateFormat to the converted date value. 
Please find the code snippet below:   
<div id="Ganttcontainer" style="height:450px;width:100%;" />  
<script type="text/javascript">  
  $(function () {  
  
            $("#Ganttcontainer").ejGantt({  
                dataSource: projectData,  
                editSettings: {  
                    allowEditing: true,  
                    allowAdding: true,  
                    allowDeleting: true,  
                    allowIndent: true,  
                    editMode: "cellEditing"  
                },  
                 
            });  
        });   
function clickme() { 
            var ganttObj = $("#Ganttcontainer").data("ejGantt"); 
            //To get the Updated Json Records 
            var data = ganttObj.model.dataSource; 
            //To alert the updated JSON value 
            alert(JSON.stringify(ganttObj.model.dataSource, replacer)); 
            function replacer(key, value) { 
                if (key == "startDate" || key == "endDate") { 
                    //To convert the date to required dateFormat 
                    return ej.format(new Date(value), ganttObj.model.dateFormat); 
                } else { 
                    return value; 
                } 
            } 
        }    
 </script>  
   
We have also prepared the sample for your reference please find the sample from below location  
Please let us know if you require further assistance on this.    
Regards               
Jone Sherine .P.S.    


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

;