custom column undefined

Hi,
I am trying create custom columns in Gantt.
Example:
gantt.config.columns = [
{ name: “text”, label: “Projects”, text: “tree”, tree: true, align: “center”, width: ‘*’ },
{ name: “start_date”, label: “StartDate”, align: “center”, template: function (obj) { return gantt.getLabel(‘start_date’, obj.start_date); } },
{ name: “duration”, label: “duration”, align: “center” },
{
name: “status”, label: “Status”, align: “center”,
template: function (obj) {
return gantt.getLabel(‘Status’, obj.Status);
},
width: ‘100px’
},
{
name: “Priority”, label: “Priority”, template: function (obj) {
return gantt.getLabel(‘Status’, obj.Priority);
}, align: “center”, width: ‘100px’
},
{ name: “add” }
];

No columns are visible in gantt grid…
Im strucking in this…Where am i going wrong?

template function is not calling i think.

Hello,
gantt.getLabel uses the lightbox configuration to retrieve a text for specified item.
docs.dhtmlx.com/gantt/api__gantt_getlabel.html
If you don’t define select controls in the lightbox, getLabel will return an empty strings.

What happens in your case is following:
‘Projects’ - is not visible because by default columns are adjusted to the width of the grid, and the resulting width of this column is too small.
‘Start Date’ - getLabel returns an empty string if used without lightbox select control. Try to use templates instead docs.dhtmlx.com/gantt/api__gantt … plate.html
‘duration’ is visible
‘Status’ and ‘Priority’ are not visible because lightbox does not have the related selectors, to get label from (at least in the code you’ve provided)
‘add’ is visible

Try to do following:

  1. increase the size of the grid
  2. specify sizes of each column in order to show maximum amount of data
  3. do not use gantt.getLabel for retrieving labels of options
    e.g. here is the codegantt.config.columns = [ { name: "text", label: "Projects", text: "tree", tree: true, align: "center", width: '*' }, { name: "start_date", label: "StartDate", align: "center", template: function (obj) { return gantt.templates.date_grid(obj.start_date); } }, { name: "duration", label: "duration", align: "center", width:70 }, { name: "status", label: "Status", align: "center", template: function (obj) { return ;//retrieve label somehow }, width: 80 }, { name: "Priority", label: "Priority", template: function (obj) { return ;//retrieve label somehow }, align: "center", width: 80 }, { name: "add", width:30 } ]; gantt.config.grid_width = 500;

Thanks…This helped me a lot…