0
votes

When i use afterChange hook (Angular 6 + Handsontable) and inside it i use hot.getDataAtCell(...) then all cells in row are changed

I tried to use different hooks (beforeChange, afterChange), non which worked

      if (changes && source) {
        this.newCellCol = source[0][0];
        this.newCellRow = source[0][1] + 1;
        this.newCellData = this.tempId.getDataAtCell(source[0][0], source[0][1]);
        console.log(this.newCellData);
      }
    },
    afterChange: (changes, source) => {
      if (changes && source) {
        this.tempId.setDataAtCell(this.newCellCol, this.newCellRow, this.newCellData);
      }
    }
  };

i would like t have entered value added also to cell next to it but it gets added to all cells in the same row Final solution will be that based on entered data in one cell, different calculated data will be inserted to 3 different cells in the same row

1

1 Answers

1
votes

In the changes array of the afterChange hook you can access row, prop (column), oldValue & newValue. You can listen for the changes in the exact column(s) through the above and you can create a custom method that would be invoked which would trigger the change(s) based on the above into your target cell(s).

 afterChanges: (changes, source) => {
     //iterate through changes
     row = changes[iterator][0]
     col = changes[iterator][1]
     oldValue = changes[iterator][2]
     newValue = changes[iterator][3]

     //listen for changes in the desired columns
     //invoke the custom method or add a block to set Data for the target cell(s)
 }

Furthermore, as a best practice, it's recommended to use setDataAtRowProp instead of setDataAtCell since the former has a flexibility of setting data for multiple cells at once.

For reference : https://handsontable.com/docs/7.2.2/Hooks.html#event:afterChange https://handsontable.com/docs/7.2.2/Core.html#setDataAtRowProp