Our state of the art Gantt chart


Post by bharat95 »

Hi,

I want to customize payload, I want to add new fields in payload.
I'm using react typescript. Please help me with it.

Thanks
Bharat

Attachments
gantt1.png
gantt1.png (41.22 KiB) Viewed 130 times

Post by tasnim »

Hi,

It's very simple to add a custom field.
Please check the docs link https://bryntum.com/products/gantt/docs/api/Gantt/model/TaskModel#subclassing-the-taskmodel-class

rlRJdcvrVK.png
rlRJdcvrVK.png (58.69 KiB) Viewed 124 times

And Here is how I added that custom field

import { TaskModel } from '@bryntum/gantt';
import { BryntumGanttProps } from '@bryntum/gantt-react';

class MyTask extends TaskModel {
    static get fields() {
        return [
            { name : 'customField', type : 'string', defaultValue : 'custom' }
        ]
    }
}

const ganttConfig: BryntumGanttProps = {
    project: {
        autoLoad: true,
        autoSync: true,
        taskStore : {
            modelClass : MyTask
        },
        transport: {
            load: {
                url: 'data/launch-saas.json'
            },
            sync: {
                url: 'sync'
            }
        },
        // This config enables response validation and dumping of found errors to the browser console.
        // It's meant to be used as a development stage helper only so please set it to false for production systems.
        validateResponse : true
    },
    columns: [{ type: 'name', field: 'name', width: 250 }],
    viewPreset: 'weekAndDayLetter',
    barMargin: 10
};

export { ganttConfig };

Post by bharat95 »

Thanks for the help. I was able to fix the issue


Post Reply