Initialize Handsontable with cell meta

Getting help Questions
1

I have a database (in Firebase) in which I store anything the user inputs in the Handsontable table. To make it real-time, I use the afterChange hook to update the database once a cell is edited. When retrieving the data for a new session, I get the data and then put it in the Handsontable instance using hot.updateSettings({data: myData}); and I check the source parameter in afterChange as to not call Firebase again when the source is loadData. The problem is with the cell meta. I also save them in Firebase and retrieve them separately, but I can’t find a way to setCellMeta without firing the before/afterSetCellMeta, as it will, in turn, update Firebase again with the meta I just got from it. Using the ‘cell’ setting to set the meta also fires these events, which are used for changes by the users.
How can I change the cell meta programmatically without firing before/afterSetCellMeta? Another option would be to check the source of the change like in afterChange so that if the source was the updateSettings function, I wouldn’t update Firebase, but this is not currently available to the best of my knowledge.

2

Hi @aabounegm

you are right, we do not have any source parameter for the afterSetCellMeta callback. Have you tried to use a helper variable that will be turned on/off inside the afterSetCellMeta?

  var stop = true;
  hot.updateSettings({
    afterSetCellMeta: function(row, col, key, value) {
      if (stop) {
        return false
      } else {
        //proceed with your code
      }

    }
  })

ps. I have added a proposition to add a source parameter to an afterSetCellMeta callback at https://github.com/handsontable/handsontable/issues/4388

3

I considered this option and it works, but I don’t like having a lot of global variables since my project has a lot of script files. The method I followed is:
in the function that gets the data from firebase, I detach the hook after saving it, and attach it again after executing the function. But since I define the callbacks using anonymous function in the settings as in
var hot = new Handontable(container, { afterSetCellMeta: function(row, col, key, value){ .... } });
I couldn’t use hot.removeHook() as the callback didn’t have a name. Here is what I did in the function in which I want to call setCellMeta without firing the event:
let callback = hot.getSettings()["afterSetCellMeta"]; hot.updateSettings({afterSetCellMeta: function(){}}); hot.setCellMeta(row, col, prop, value); hot.updateSettings({afterSetCellMeta: callback});

4

Thanks for sharing your solution. I am glad that you’ve found a way to get over this callbacks.
Is there anything else you would like to know now?

5

Thank you very much.
There is one thing I am trying to do now, but I think it needs another thread. Nevertheless, I have manualColumnMove option enabled because I need it, but I also have a fixedColumn in the beginning. Currently, I can move this column to another location and the next column will take its place as the fixedColumn. I need to disable this behaviour, such that the fixed column cannot move. How can I do that?

6

It’s a quick demo so if the issue from the title is solved I guess I can send the second one here as well. For blocking the movement of fixed columns you can use the beforeColumnMove callback. Here’s an example http://jsfiddle.net/puqj1asm/

Please test it and let me know if it’s the solution or you need anything extra.

7

I assume that we can close the issue as there is no reply for 2 weeks. If you’d have any issues with the code please create a new ticket.