Hi,
When i try to group tasks, the group folder is set to “undefined” like this:
I did everything like this sample: Tasks grouping
Thanks in advance,
Sara
Hi Sara,
please share your example so somebody could check what might be wrong with it
Gantt takes text for the group folder from the property of group object specified in group_text parameter of gantt.groupBy method
gantt.groupBy({
relation_property: "priority",
groups: [
{key:1, label: "High"},
{key:2, label: "Normal"},
{key:3, label: "Low"}
],
group_id: "key",
group_text: "label" // <-- HERE, label will be taken from group.label
});
Make sure this parameter points to the right property of your group objects
<script type="text/javascript">
var tasks = {
data: [
{ "id": 310,"text": "Redline","type": "task", "start_date": "22-01-2019 00:00", "duration": 2, "order": 20, "progress": 0, "parent": 308, "open": false, "owner_id": "Olivier", "color": "#8500AF", "priority": "2", "statut": " ", "stage": "Redline"},{ "id": 311,"text": "CdP","type": "milestone", "start_date": "15-01-2019 00:00", "duration": 0, "order": 30, "progress": 0, "parent": 308, "open": false, "owner_id": "", "color": "#b9b9b9", "priority": "2", "statut": " ", "stage": "CdP"},{ "id": 315,"text": "Redline","type": "task", "start_date": "22-01-2019 00:00", "duration": 3, "order": 20, "progress": 0, "parent": 313, "open": false, "owner_id": "Olivier", "color": "#8500AF", "priority": "2", "statut": " ", "stage": "Redline"},{ "id": 316,"text": "CdP","type": "milestone", "start_date": "15-01-2019 00:00", "duration": 0, "order": 30, "progress": 0, "parent": 313, "open": false, "owner_id": "", "color": "#b9b9b9", "priority": "2", "statut": " ", "stage": "CdP"},{ "id": 320,"text": "Dessin de production","type": "task", "start_date": "03-02-2019 00:00", "duration": 2, "order": 20, "progress": 0, "parent": 318, "open": false, "owner_id": "Jasmin", "color": "#CE3B00", "priority": "2", "statut": " ", "stage": "Dessin de production"}
],
links: [
{ id: 540, source: 361, target: 391, type: "0", lag: 0},{ id: 541, source: 391, target: 396, type: "0", lag: 0},{ id: 544, source: 492, target: 565, type: "0", lag: 0},{ id: 546, source: 560, target: 542, type: "0", lag: 0},{ id: 547, source: 507, target: 547, type: "0", lag: 0},{ id: 548, source: 422, target: 361, type: "0", lag: 0},{ id: 549, source: 532, target: 512, type: "0", lag: 0},{ id: 550, source: 512, target: 522, type: "0", lag: 0},{ id: 553, source: 448, target: 422, type: "0", lag: 0}
]
};
gantt.serverList("stage", [
{key:"MV + CL", label: "MV + CL"},
{key:"Redline", label: "Redline"},
{key:"Dessin initial", label: "Dessin initial"},
{key:"CdP", label: "CdP"},
{key:"Dessin de production", label: "Dessin production"},
{key:"Correction", label: "Correction"},
{key:"OFA", label: "OFA"}
]);
gantt.serverList("owner_id", [
{key:"Jean Pierre", label: "JeanPierre"},
{key:"Sylvain", label: "Sylvain"},
{key:"Chloe", label: "Chloe"},
{key:"Olivier", label: "Olivier"},
{key:"Jasmin", label: "Jasmin"},
{key:"Feng", label: "Feng"}
]);
gantt.config.order_branch = true;
gantt.config.grid_width = 420;
gantt.config.row_height = 24;
gantt.config.grid_resize = true;
gantt.locale.labels.column_stage =
gantt.locale.labels.section_stage = "Stage";
gantt.locale.labels.column_owner =
gantt.locale.labels.section_owner = "Owner";
gantt.locale.labels.section_resources = "Resources";
function byId(list, id) {
for (var i = 0; i < list.length; i++) {
if (list[i].key == id)
return list[i].label || "";
}
return "";
}
gantt.config.columns = [
{name: "nom", tree: true, width: 180, resize: true},
{name: "start_date", align: "center", width: 80, resize: true},
{name: "duration", width: 60, label: "Duree", align: "center"},
{
name: "stage", width: 80, align: "center", label: "Etat", template: function (item) {
return byId(gantt.serverList('stage'), item.stage)
}
},
{
name: "owner", width: 80, align: "center", label: "Ressource", template: function (item) {
return byId(gantt.serverList('owner_id'), item.owner_id)
}
},
{name: "add", width: 44}
];
gantt.config.lightbox.sections = [
{name: "description", height: 38, map_to: "text", type: "textarea", focus: true},
{name: "owner", height: 22, map_to: "owner_id", type: "select", options: gantt.serverList("owner_id")},
{name: "stage", height: 22, map_to: "stage", type: "select", options: gantt.serverList("stage")},
{name: "time", type: "duration", map_to: "auto"}
];
gantt.templates.grid_row_class =
gantt.templates.task_row_class = function (start, end, task) {
if (task.$virtual)
return "summary-row"
};
gantt.templates.task_class = function (start, end, task) {
if (task.$virtual)
return "summary-bar";
};
gantt.init("gantt_here");
gantt.sort("start_date");
gantt.parse(tasks);
function showGroups(listname) {
if (listname) {
gantt.groupBy({
groups: gantt.serverList(listname),
relation_property: listname,
group_id: "key",
group_text: "label",
default_group_label: "Not Assigned"
});
gantt.sort("start_date");
} else {
gantt.groupBy(false);
}
}
</script>
Thanks!
Hi,
If I’ve copied everything correctly, your config should give you undefined labels even without task grouping:
http://snippet.dhtmlx.com/a21f7fd58
Try setting a template for the first column of your grid:
http://snippet.dhtmlx.com/a482c3456
code:
gantt.config.columns = [
{name: "nom", tree: true, width: 180, resize: true, template: function(task){return task.text}},
{name: "start_date", align: "center", width: 80, resize: true},
{name: "duration", width: 60, label: "Duree", align: "center"},
{
name: "stage", width: 80, align: "center", label: "Etat", template: function (item) {
return byId(gantt.serverList('stage'), item.stage)
}
},
{
name: "owner", width: 80, align: "center", label: "Ressource", template: function (item) {
return byId(gantt.serverList('owner_id'), item.owner_id)
}
},
{name: "add", width: 44}
];
1 Like
Thank you very much! It work!