[REACT] [BUG] Unable to reorder non default columns

[ext_mkucanda]

Hi,

I have an error that happens when you try to reorder column that is not visible by default. I am also attaching the screen recording of an error. I console log events that are fired by the gantt:

ganttInstance.onColumnDragStart = () => {
  console.log('event onColumnDragStart');
};
ganttInstance.onColumnDrag = () => {
  console.log('event onColumnDrag');
};
ganttInstance.onBeforeColumnDropFinalize = () => {
  console.log('event onBeforeColumnDropFinalize');
};
ganttInstance.onColumnDrop = () => {
  console.log('event onColumnDrop');
};

Do you have an idea maybe why this happens? Also, if you have any information about the workaround that I could apply?

[ext_mkucanda]

I have problems adding video here as an attachment so I put it online: https://youtu.be/aU0RW-UNhjo

[ghulam.ghous]

Hi @ext_mkucanda,

I have tried the same steps here https://bryntum.com/products/gantt/examples/frameworks/react/javascript/advanced/build/ and was unable to reproduce the issue. Can you please try in our demo and see if you can reproduce this issue. Also which version of Gantt you are using? Can you please try upgrading to the latest version and see if it may solve your issue? If not, then I am afraid to say we are going to need a test case where we can reproduce this issue.

Regards,
Ghous

[ext_mkucanda]

Unfortunately,

upgrading to the latest version didn't help. We were on the version 5.6.7.

I will try to gather more information for you. Maybe try to downgrade to see on which version this error started to happen or why for some columns (non-default columns) are not working and for others are working.

[ext_mkucanda]

Unfortunately,

upgrading to the latest version didn't help. We were on the version 5.6.7.

I will try to gather more information for you. Maybe try to downgrade to see on which version this error started to happen or why for some columns (non-default columns) are not working and for others are working.

[tasnim]

Would it be possible for you to share a runnable test case with us so we can reproduce it easily and debug it?

[ghulam.ghous]

Hi @ext_mkucanda,

I forgot to upload the clip showing the steps I tried. We will be waiting for test case to reproduce this issue. I believe it is some weird combinations of configs that might be causing this issue. Here's the clip: https://drive.google.com/drive/folders/1Sic-lTcwt_xWyoVg_3MU2VaMmYTL3Bz0?usp=sharing

Here's the demo project that I used:

advanced.zip

You can use it as a starting point and add your config in it to cause the issue.

Regards,
Ghous

[ext_mkucanda]

Hey guys,

I managed to figure out what was causing an issue. An issue was introduced when I added this: viewtopic.php?t=27301 This should not be related with columns drag&drop functionality, but somehow is causing it.

I removed this: column.editor.picker.align.matchSize: false from the column configuration and I no longer have that issue for this column. So I think it should be easy for you to repro the bug.

[alex.l]

Hi, I am not able to reproduce this with this code applied

editor : { type : 'dropdown', items : DataGenerator.cities, picker : { align : { matchSize : false } } }

To this demo https://bryntum.com/products/grid/examples/celledit/

Please try yourself in our online demos or provide code to reproduce this. Thank you!

[ext_mkucanda]

Thank you very much guys for looking this for me! I tried to reproduce it one more time in your examples, but unsuccessfully. So I was further debugging my code.

An error was in my custom code: gantt.columns.on({ change: this.onAddColumnConfigureField }); Inside this onAddColumnConfigureField function.

if (column.editor.isCombo) { // changing this line to if (column.editor?.isCombo) fixes the issue
  column.editor.picker.align.matchSize = false;
}

I am confused a little bit why a was not getting this error in the console. Something like: "cannot set isCombo of undefined" or something like that.

Now everything works fine for me!

Thank you,

Regards,
Mislav