How to use customCell and Reorder in Kendo react Grid at the same time ?

[Nassefferjeni]

So I am using Kendo React Grid and I am setting the reorder to true and also added a custom cell where I can show/hide columns.

when I don't reorder and try to show/hide everything works fine but when I reorder the columns and then try to hide then restore the column everything will get messy and I can't understand where I can control this.

This is the grid at first.

This is where I reorder the columns

Now I opened the customCell and tried to hide the first column

This is the result where I click on Save the order is changing and I don't know why

this is the Telerik documentation and in all examples there is no one where I can find reorder and customCell at the same time: https://www.telerik.com/kendo-react-ui/components/grid/

And this is the reorder section/ I couldn't find details about customizing the reorder: https://www.telerik.com/kendo-react-ui/components/grid/columns/reordering/

[Xizario]

If the columns are changed dynamically, each column need to have orderIndex defined, to be placed in the proper place after reordering.
You can use the onColumReorder callback to obtain the proposed orderIndex for each of the columns and store them over your original columns.

There are several possible ways to implement this, depending on what you expect to happen. Here is use case:

Columns: ABCD , user hide B.
Columns: ACD, user then reorder D before A.
Columns DAC. User then show B. Where B should go?

Possible outputs:

1. DBAC - B shows on its position where it was before hiding.
2. DABC - B is in the place where it should have been if it was not hidden during the reordering.
3. BDAC - B shows first
4. DACB - B shows last.

Personally I prefer second option as it can be implemented for the order the columns in the Column Menu custom cell as well. And the user will know where the column will be even before showing it.

See in your screenshot from step 3, https://i.stack.imgur.com/pJ2TO.png I would expect Description to be above ID in the menu as well.

If this is the desired scenario, let us know and we will add it to the docs.

[Nassefferjeni]

Thank you for your response. I used the orderIndex and successfully implemented the first output:
DBAC - B shows on its position where it was before hiding