[GH #6782, #6783] Is there any way to save and restore user preferences like column resize, sorting, ordering

Tags: #<Tag:0x00007f136d906be0> #<Tag:0x00007f136d906aa0>

This demo is already saving key/value pairs to the localStorage

If you’d like to get the same information from the instance you can track the hook

Yes its saving column sorting feature , But i Want to save filter also.

Filtering is not supported by the persistentState functionality.

In this case, you can use the afterFilter hook to save settings into localStorage. There are a lot of information you can get from this filter (complex object is returned by the hook) so let me just give an example

afterFilter: function(){
      let columnsFiltered = arguments[0].length.toString();
      localStorage.setItem('columnsFiltered', columnsFiltered)
}

demo https://jsfiddle.net/ykm50do8/

ps. I 've added the request to add filtering to persistentState plugin https://github.com/handsontable/handsontable/issues/6782
I will notify you once it happens.

Thanks its working now . Is there any hooks to save freeze columns ??

Actually there is no hook dedicated for freezing columns. Freezing calls the move plugin


But that is not a way to track freezing as now it does not tell the developer if the column moved or has been frozen.

I reported the need for the following hook here https://github.com/handsontable/handsontable/issues/6783

At this point I need to thank you. I have realized that we miss two different functionalities in the library.

  • saving filtering to localStorage
  • reporting freezing

I will definitely inform you once any of those functionalities will be added to the official version of Handsontable.

Great thanks…

Hi @aleksandra_budnik

I am trying to store fixed columns manually, How can I get manually fixed columns or any event will be fired when I click on “freeze column” from the context menu ??

Hi @suman.dutta

does the fixedColumnsLeft of getSettings help?

demo https://jsfiddle.net/dn1bxtsk/

I tried it but, I want array of column’s index which are fixed.

Does getting column name help?

Here’s https://jsfiddle.net/qL94c82e/ an example that returns the current column order

Its not working when you set dropdownMenu: true,
And if i get column id it would be helpful.

You’re right - adding any other element to headers breaks the rule

TH.children[0].children[0].innerText

so this has to be adjusted.

When you use dropdownMenu the rule changes to

if (TH.children[0].children[1]) {
        console.log(TH.children[0].children[1].innerText);
}

(2n children, not the first one)

if i get column id it would be helpful.

If you would set the colHeaders as an array of values you’d be able to call the native indexOf method on that array in the afterGetColHeader hook.

Thanks.

Hi,
Is this feature added? “saving filtering to localStorage”

Hi @suman.dutta

we haven’t added it yet. However, I highly encourage to try running the saving script by yourself via afterFilter hook. I can imagine that those settings can be saved as a deep copy (JSON.stringify()) and kept this way until the user reloads the page.

Yes i tried it , But i am facing another issue .
I implemented column drawer option , When a user unchecked any column from dropdown , Then i call updateSettings function with new columns but this time saved filter it overlapping with another column.

It sounds like you need to update the filter state when columns are removed. You can also use the localStorage.setItem(‘key’, ‘value’); to overwrite it when columns are unchecked.

no for example

I have 4 column a, b , c , d have index of(0, 1, 2, 3)

I applied filter on column c , Then i remove column b , Now the index of column c became from 2 to 1.
But filter value is stored in local storage index of previous one that’s why conflicting.

Yes, that’s why I wrote

When your columns order change you need to overwrite the localStorage value.
Have you already tried it and have a demo?

Thanks its work for me.