I'm having issues with the Gantt chart throwing errors when I create tasks.
This is the code I am using to initalise the gantt chart
project = new ProjectModel({
transport: {
load: {
// url: 'https://localhost:3001/static/test-datasets/launch-sass-min.json'
url: `${apiFactory.getBaseURL()}gantt/${User.projects[selectedProject].id}/`,
credentials: 'omit',
requestConfig: {
headers: {
Authorization: `Token ${Token.token_string}`,
'X-Company': Company.getSelectedCompanyId(),
},
},
},
sync: {
url: `${apiFactory.getBaseURL()}gantt/${User.projects[selectedProject].id}/`,
credentials: 'omit',
requestConfig: {
headers: {
Authorization: `Token ${Token.token_string}`,
'X-Company': Company.getSelectedCompanyId(),
},
},
},
},
autoSync: true,
});
gantt = new Gantt({
adopt: 'gantt',
project: project,
startDate: User.projects[selectedProject].start_date,
endDate: User.projects[selectedProject].complete_date,
rowHeight: 40,
barMargin: 7,
width: 'calc(100vw - 420px)',
columns: [{ type: 'name', field: 'name', width: 250 }],
features: {
showDirty: false,
taskContextMenu: {
// We would like to remove some of the provided options in the add menu
items: {
add: {
menu: {
items: {
subtask: false,
successor: false,
predecessor: false
}
}
},
indent: false,
outdent: false
},
},
taskEdit: {
tabsConfig: {
// change title of Dependencies tab
// predecessorstab: {
// title: 'Dependencies',
// },
predecessorstab: false,
successorstab: false,
// remove Notes tab
notestab: false,
// remove Resources tab
resourcestab: false,
// remove Advanced tab
advancedtab: false,
},
},
},
// Custom task content, display task name on child tasks
// taskRenderer({ taskRecord }) {
// if (taskRecord.isLeaf && !taskRecord.isMilestone) {
// return taskRecord.name;
// }
// },
});
project.load();
The initial data that gets sent back from the server is as follows
{
"success": true,
"tasks": {
"rows": [
{
"id": "ad2fe597-ec7c-41d3-a713-849f531224cc",
"createdAt": "2020-09-21T03:02:59.824235Z",
"updatedAt": "2020-09-21T03:02:59.824235Z",
"percentDone": 0,
"constraintType": "startnoearlierthan",
"constraintDate": "2020-08-12T14:00:00Z",
"effortDriven": false,
"schedulingMode": "Normal",
"effort": 24.0,
"effortUnit": "hour",
"manuallyScheduled": false,
"startDate": "2020-08-12T14:00:00Z",
"endDate": "2020-08-17T14:00:00Z",
"duration": 5.0,
"durationUnit": "day",
"name": "New task 1",
"$PhantomId": "_generated_0x2dd2af1",
"dependencies": []
},
{
"id": "529e8584-9662-4cd8-979b-2ddb04d5fcb8",
"createdAt": "2020-09-20T23:58:53.293328Z",
"updatedAt": "2020-09-21T03:02:59.826232Z",
"percentDone": 0,
"constraintType": "startnoearlierthan",
"constraintDate": "2020-08-19T14:00:00Z",
"effortDriven": false,
"schedulingMode": "Normal",
"effort": 24.0,
"effortUnit": "hour",
"manuallyScheduled": false,
"startDate": "2020-08-19T14:00:00Z",
"endDate": "2020-08-19T14:00:00Z",
"duration": 0.0,
"durationUnit": "day",
"name": "New milestone 1",
"$PhantomId": "_generated_0x2dd2af1",
"dependencies": []
},
{
"id": "486cee2d-2047-45d8-afaf-54721b336c6e",
"createdAt": "2020-09-20T23:57:11.388334Z",
"updatedAt": "2020-09-21T03:03:05.494084Z",
"percentDone": 0,
"constraintType": "startnoearlierthan",
"constraintDate": "2020-08-11T14:00:00Z",
"effortDriven": false,
"schedulingMode": "Normal",
"effort": 24.0,
"effortUnit": "hour",
"manuallyScheduled": false,
"startDate": "2020-08-12T14:00:00Z",
"endDate": "2020-08-17T14:00:00Z",
"duration": 5.0,
"durationUnit": "day",
"name": "Test",
"$PhantomId": "_generated_0x2dd2af1",
"dependencies": []
}
]
},
"dependencies": { "rows": [] }
}
Then after you create a new task the ProjectModel posts the new task
Request
{
"type": "sync",
"requestId": 16006580210072,
"tasks": {
"added": [
{
"cls": "",
"baselines": [],
"percentDone": 0,
"parentId": null,
"parentIndex": 3,
"effortDriven": false,
"schedulingMode": "Normal",
"effort": 24,
"effortUnit": "hour",
"manuallyScheduled": false,
"startDate": "2020-08-12T14:00:00.000Z",
"endDate": "2020-08-13T14:00:00.000Z",
"duration": 1,
"durationUnit": "day",
"direction": "Forward",
"calendar": "_generated_0x2dd2af1",
"name": "New task",
"$PhantomId": "_generated_0x2dd2af1"
}
]
}
}
Response
{
"success": true,
"requestId": 16006580210072,
"tasks": {
"added": [
{
"id": "bcad7e62-b884-4ea6-8c1f-b657ba04d362",
"createdAt": "2020-09-21T03:13:41.105942Z",
"updatedAt": "2020-09-21T03:13:41.106441Z",
"percentDone": 0,
"constraintType": "startnoearlierthan",
"constraintDate": "2020-09-21T03:13:41.105942Z",
"effortDriven": false,
"schedulingMode": "Normal",
"effort": 24.0,
"effortUnit": "hour",
"manuallyScheduled": false,
"startDate": "2020-08-12T14:00:00.000Z",
"endDate": "2020-08-13T14:00:00.000Z",
"duration": 1.0,
"durationUnit": "day",
"name": "New task",
"$PhantomId": "_generated_0x2dd2af1",
"dependencies": []
}
],
"updated": [],
"removed": []
},
"dependencies": { "added": [] }
}
I'm not sure why but after this, whenever I try to move the new task left and right it throws this error in the browser console and I don't know why.
Uncaught TypeError: _0xce0fc6 is undefined
selectEvent gantt.module.js:190
processEvent gantt.module.js:190
onTargetClick gantt.module.js:28
_0x4fc3c0 gantt.module.js:10
addElementListener gantt.module.js:10
on gantt.module.js:10
set target gantt.module.js:28
set gantt.module.js:10
setConfig gantt.module.js:10
configure gantt.module.js:10
construct gantt.module.js:10
construct gantt.module.js:10
Base gantt.module.js:10
Events gantt.module.js:10
Navigator gantt.module.js:28
construct gantt.module.js:177
construct gantt.module.js:190
Base gantt.module.js:10
Localizable gantt.module.js:10
Events gantt.module.js:10
Delayable gantt.module.js:10
Widget gantt.module.js:10
Container gantt.module.js:10
Pluggable gantt.module.js:22
State gantt.module.js:22
GridElementEvents gantt.module.js:138
GridFeatures gantt.module.js:138
GridNavigation gantt.module.js:138
GridResponsive gantt.module.js:138
GridSelection gantt.module.js:138
GridState gantt.module.js:138
GridSubGrids gantt.module.js:153
GridBase gantt.module.js:153
TimelineDateMapper gantt.module.js:177
TimelineDomEvents gantt.module.js:177
TimelineEventRendering gantt.module.js:177
TimelineScroll gantt.module.js:177
TimelineViewPresets gantt.module.js:177
TimelineZoomable gantt.module.js:177
TimelineBase gantt.module.js:177
CrudManagerView gantt.module.js:162
GanttDom gantt.module.js:190
GanttRegions gantt.module.js:190
GanttScroll gantt.module.js:190
GanttState gantt.module.js:190
GanttStores gantt.module.js:190
GanttTimelineDateMapper gantt.module.js:190
Delayable gantt.module.js:10
EventNavigation gantt.module.js:177
TaskNavigation gantt.module.js:190
GanttBase gantt.module.js:190
Gantt gantt.module.js:190
initGanttChart gantt.js:209
onchange gantt.js:876
callback mithril.js:948
I have a feeling that the response from the server is somehow messing with the data parser in the ProjectModel, but I'm not sure.
I really appreciate any help given, thanks!