Handsontable table column reorder

Tags: #<Tag:0x00007f8b1d9a7900>
#1

Multiple columns are visible in table and I’m displacing 2 columns and I’m all the columns except these 2 displaced column then these 2 columns name are changing to A and B not retaining the original column name. how can I handle this issue in using handsontable??

#2

Hey @souravkrraj35

When you use colHeaders: true like here https://jsfiddle.net/zsqnd7oy/ we keep the A, B, C... names even when you move columns. But when you set custom names of columns like here https://jsfiddle.net/zsqnd7oy/2/ the column labels are moved with columns.

#3

@aleksandra_budnik I checked your solution now A,B not coming…but after clearing the columns and keeping only 2 columns that were displaced it’s not giving correct column name now…how can I show the correct column name??

#4

Do I need to update the table column placement using persiststate and if I’ve to do then how??

#5

If you want the order you set to be kept, then yes you can use the persistentState.

#6

how can I use?? I tried to see documentation and done some changes according to it but it’s not working…

#7

To enable the persistentState you just need to enable the plugin (set it to true). If you use modularization you will need to import and register the plugin first. The persistentState plugin uses local storage so if you use incognito mode, clear the local storage, or change browsers it will not save your column order.

#8

@aleksandra_budnik here are my changes and It’s not working. can you check what am I doing wrong here??
persistentState:true,
colHeaders: visibleColumnNames,
afterColumnMove: function(movedColumns, finalIndex, dropIndex, movePossible, orderChanged) {
const persistentStatePlugin = this.getPlugin(‘PersistentState’);
persistentStatePlugin.resetValue(‘manualColumnMove’);
},

#9

In this case, you are using the PersistentState till the columns are moved. Why did you decide to use resetValue()?

#10

I’m not sure I just googled and found some code and tried it. This resetValue saving the latest positions of columns in browser storage.

where should I put PersistentState then??

#11

Hi @souravkrraj35

I made a short demo with comment to check if we are on the same page https://jsfiddle.net/b52xk9hp/11/
Does it work as you require?

#12

I assume that the demo works well for you, @souravkrraj35 as there are no further questions.
However, if you need anything please feel free to open a new ticket or contact us at support@handsontable.com

#13