Our state of the art Gantt chart


Post by rodel.ocfemia »

Hi,

Can you please give some example how to implement dropdown list column in React? Example I have column Status, then each row should have custom list items that I can select to update the particular row.

Thanks


Post by tasnim »

Hi,

Just to be confirmed,
Please check the video below
it's rendering its own items according to the condition
for parent task it is loading warm, cold, normal
and for child task it is loading To do, Doing, Done

Recording 2023-03-06 130935.mp4
(4.56 MiB) Downloaded 33 times

Is it what you're looking for?

Here is the zip file for it

basic.zip
(2.06 MiB) Downloaded 29 times

Post by rodel.ocfemia »

Thanks Tasnim. I'll take a look.


Post by rodel.ocfemia »

Hi Tasnim,
If I'm going to convert the following code for React Typescript, what should be the data type of editorContext? It's giving me "Binding element 'editorContext' implicitly has an 'any' type.ts(7031)" error.

startCellEdit : ({ editorContext }) => {
            const { record, editor, column } = editorContext;
            if (column.field === 'condition' && record.isLeaf) {
                // Load possible employees to assign to this particular task
                editor.widgetMap['b-combo-2'].items = ['To do', 'Doing', 'Done', 'Test'];
            } else {
                editor.widgetMap['b-combo-2'].items = ['warm', 'cold', 'normal'];
            }
        }

Thanks


Post by tasnim »

Hi,

For now, you could use any type for that
We have a ticket to improve our type definitions here https://github.com/bryntum/support/issues/5176


Post by rodel.ocfemia »

Hi Tasnim,

Currently, the width of the dropdown list is exactly the same as the width of the column. Is there a way to make the dropdown list's width adjust if the item name width is longer than the column width?

Thanks


Post by tasnim »

Hi,

You could adjust the picker width using this https://bryntum.com/products/gantt/docs/api/Core/widget/Combo#config-pickerWidth

editor.widgetMap['b-combo-2'].pickerWidth = 200;

Post by Animal »

You're using a hardcoded string there which just happens to be the id of the combo!


Post by rodel.ocfemia »

For the items, can it support an array of object?

current code

editor.widgetMap['b-combo-2'].items = ['To do', 'Doing', 'Done']

sample below. then on edit, the value that should be passed as payload on sync is the id.

editor.widgetMap['b-combo-2'].items = [{id:1 , text: 'To do'},{id: 2, text: 'Doing'},{id: 3, text: 'Done'}]

Post by tasnim »

Hi,

You could use this https://bryntum.com/products/grid/docs/api/Core/widget/Combo#config-valueField
set it to 'id'

        {
            text : 'Condition',
            field : 'condition',
            editor : {
                type : 'combo',
                valueField : 'id'
            }
        }

Post Reply