[REACT] WANT SEPARATE COLUMN FOR THE MAGNITUDE AND UNIT IN TASK EDITOR

[JSureka]

HI,
In our project we have a requirement where we want the magnitude and unit of the lag column to be separate that is in one column we have to type the number and in another column we have to select the corresponding unit from the combo . I have tried to bring it on but the unit and the magnitude column are not syncing . I have attached the code I tried below .

 {
                text: "Lag",
                type: "duration",
                field: "fullLag",
                width: "72px",
                renderer: ({ value }) => {
                  return (value._magnitude);
                },
                editor: {
                  allowNegative: true,
                },
              },
              {
                text: "UoM",
                type: "duration",
                field: "fullLag",
                width: "90px",
                renderer: ({ value }) => {
                  return (value._unit);
                },
                editor: {
                  type:'combo',
                  items:["day","hour","minute"],
                },
              },
              

          

I have also attached the screenshot to show how I want it to be .
what can be done to meet this requirement ?

[mats]

You should not use fullLag as field, try something like:

 {
                text: "Lag",
                type: "duration",
                field: "lag",
                width: "72px",
                renderer: ({ value }) => {
                  return (value._magnitude);
                },
                editor: {
                  allowNegative: true,
                },
              },
              {
                text: "UoM",
                type: "duration",
                field: "lagUnit",
                width: "90px",
                renderer: ({ value }) => {
                  return (value._unit);
                },
                editor: {
                  type:'combo',
                  items:["day","hour","minute"],
                },
              },
              

      

[JSureka]

Hi,
I tried the changes you suggested the unit column (field="lagUnit") is working fine but in the magnitude column (field="lag") when I type the required magnitude it is automatically choosing a value in the editor and once I come out of it it is automatically set to infinity. I have attached the screenshot showing the error .

{
    text: "Lag",
    type: "duration",
    field: "lag",
    width: "72px",
    renderer: ({
        value
    }) => {
        return (value);
    },
    editor: {
        allowNegative: true,
    },
},

How to fix this?

[mats]

For your 'lag' magnitude column, try using just a regular NumberColumn?

{
    text: "Lag",
    type: "number",
    field: "lag"
}

[JSureka]

I have changed the type its working fine.

1. But when I try changing the lag in editor it is not dynamically reflecting, it is changing only when I came out of the lag editor. I want it to reflect dynamically. How I can do that?
2. Even if I click "cancel" still the number I have entered in the lag column are displaying.

I have attached the code below it can be run in the basic demo and you can check.

features: {
    taskEdit: {
        items: {
            predecessorsTab: {
                items: {
                    grid: {
                        columns: [{
                                text: "Predecessor Task",
                                field: "fromEvent",
                                width: "318px",
                                renderer: ({
                                    value: event,
                                    grid
                                }) => {
                                    const dependencyIdField = grid
                                        .parent.dependencyIdField;
                                    return (event && event.name);
                                },
                                finalizeCellEdit: "up.finalizeLinkedTaskCellEdit",
                                editor: {
                                    type: "modelcombo",
                                    displayField: "name",
                                    valueField: "id",
                                    editable: false,
                                    allowInvalid: true,
                                },
                            },
                            

                        {
                            text: "newLag",
                            type: "number",
                            field: "lag",
                            editor: {
                                allowNegative: true,
                            },
                        },
                        {
                            text: "newLagunit",
                            type: "duration",
                            field: "lagUnit",
                            renderer: ({
                                value
                            }) => {
                                return (value);
                            },
                            editor: {
                                type: 'combo',
                                items: ["day", "hour", "minute",
                                    "week", "month"
                                ],
                            },
                            
                        }
                    ]
                }
            }
        }
    }
}
},

[mats]

But when I try changing the lag in editor it is not dynamically reflecting, it is changing only when I came out of the lag editor. I want it to reflect dynamically. How I can do that?

Please set this on your column: https://bryntum.com/docs/scheduler/#Grid/column/Column#config-instantUpdate

[JSureka]

Got it for 1st question. Thank you.
What can I do for 2nd question

2.Even if I click "cancel" still the number I have entered in the lag column are displaying.

[mats]

You mean you have an active lag column cell editor and you press Cancel on the Task editor?

[JSureka]

Normally in predecessors tab we have lag column, we give the lagging number and then we click on save if need to be saved or we click on cancel to cancel the change.

But In my code when I click on cancel button in the task editor [that is I don't want to save the lag number I changed in the task editor]. But when I open the task editor for the same task again, here still the number is displaying in the lag column though I have not saved it.

You can check with the code in basic demo.

[alex.l]

Hi JSureka,

This is a known bug that will be fixed in 4.1.0 release https://github.com/bryntum/support/issues/2372

Thanks for the report!
Alex