Indexmapper reset after loaddata/updatesettings(column and data)

Tags: #<Tag:0x00007efc6dbf22d0>
#1

We have recently upgraded to 8.4 to use manualcolumnmove feature with hidden columns.

Using 8.4.0 above said issue is resolved but updated columnindexmapper values get reset whenever I call loaddata() or updateSettings.

I have tried to restore the value using following code but it does not render on UI and column index still shows reset index.

this.hot.columnIndexMapper.setIndexesSequence(OldIndexValueArray);

#2

Any updates on this issue team.

#3

Hi @akash.singla

the linked issue related to hiding columns. Loading data is another operation. By default when data changes (a whole new dataset) then Handsontable removes the old manualColumnMove settings.

However, if you prefer to keep it you can store those states in the localStorage via persistentState functionality. Here is a demo https://jsfiddle.net/c3fxvo0d/1/

Reference: https://handsontable.com/docs/saving-data/#saving-changes-using-a-callback

#4

Hi @aleksandra_budnik

We are not using the native persistentState to save the state of the table. But, we also need to reapply the states after re-load the data.

I tried calling the updateSettings after the loadData. Not sure if this is correct way but I do see the new data and the column states are updated.

Please check this fiddle: https://jsfiddle.net/guobacai/jgkzf87h/1/

After clicking the button, it is expected:

  1. New data is loaded.
  2. The column ‘Bronson’ is moved to the last position.

The actual behavior is:

  1. New data is loaded.
  2. However, the columns are not moved correctly. I directly set manualColumnMove to [0, 4, 1, 2, 3].
    According to the doc, this means move the second column to the last position.
    https://handsontable.com/docs/api/manual-column-move/#options

Let me know if anything is incorrect in the jsfiddle.

Thanks so much.

#5

Hi @lijigang.us

in the following example you tell the last column to just between the first and the second column

image

If you want to have Bronson on the last position the patterns for manualColumnMove is to push the index of this column on the last position in the array

image

Updated demo https://jsfiddle.net/28wLf3d5/2/

1 Like
#6

Hi @aleksandra_budnik

Thanks for such detail explanation.

According to your explanation, the array of the manualColumnMove is:

  1. Its index is the visual index.
  2. Its actual item is the physical index.

Is my understanding correct?

#7

The move action is made on the column of a physical index. You can test it out once the manukaColumnMove configuration stays as before

manualColumnMove: [0, 2, 3, 4, 1]

And Bronson was the one who was moved to the last column.

Now, reload the demo and move Bronson to be the first column in the table.

image

and click the button. In the result Bronson is still the last one, even though Ann is the visual index 1.

#8

Thanks so much. @aleksandra_budnik

#9