Category / Section
                                    
                                Render and update remote data using ODataV4Adaptor in Gantt
                
                
                    2 mins read
                
            
    In Gantt, using the ODataV4Adaptor, it is possible to fetch the remote data from the Odata (V4) data source. Also, it is possible to perform CRUD actions and update the remote data from the Gantt chart by using the actionComplete client-side event.
Using the AJAX method, you can update the remote data from client side.
function ActionComplete(args) {
 
//To update on indent,outdent,taskbar editing and predecessor drawn action 
if (args.requestType == "indent" || args.requestType == "outdent" || args.requestType == "recordUpdate" || (args.requestType === 'save' && args.modifiedRecord)) {
//...
updateModifiedGanttRecords(ganttRec);
}
 
//Newly Added Record is obtained here, which can be updated to database 
else if (args.requestType == "save" && args.addedRecord) {
//...
$.ajax({
type: "Post",
url: '/odata/Orders',
data: data,
dataType: 'json'
});
} else if (args.requestType == "dragAndDrop") {
 
//...
updateModifiedGanttRecords(ganttRec);
}
 
//To update the database on delete action 
else if (args.requestType == "delete") {
var data = args.data.item;
$.ajax({
url: '/odata/Orders(' + data.Id + ')',
type: "Delete",
data: data
});
}
}
 
// To update the multiple modified Gantt records in single request. 
function updateModifiedGanttRecords(records) {
var modifiedRecord = {};
if (records && records.length) {
var length = records.length;
for (var i = 0; i < length; i++) {
//...
$.ajax({
url: '/odata/Orders(' + modifiedRecord.Id + ')',
type: "PUT",
data: modifiedRecord
});
}
 
}
}
Refer here to find the sample for CRUD actions using the OData adaptor in Gantt.