afterRemoveRow hook not validating properly

[matgrabon]

Hello,
I have the following setup:

afterRemoveRow: function() {
      this.invalidCells = []
      this.validateCells()
    },
afterCreateRow: function(row, amount){
      this.invalidCells = []
      let rowsCount = this.countRows()
      let toValidate = []
      for (let i=0; i<rowsCount; i++) {
        if (i!= row) {
          toValidate.push(i)
          if (amount <1) {
            row++
            amount-- 
          }
        }
      }
      this.validateRows(toValidate)
    },

And the steps to reproduce my problem are as following:

1. Create empty row above (new row is not validated while created)
   
   
   
   
   
2. Create empty row below (again, new row is not being validated, but old one does)
   
   
3. Delete row number 2 (red one)
   
   
   
   
   
4. Expecting row number 3 to become red, instead number 2 is red.

This approach may look a bit strange, but I need to validate the cells before table is saved to DB. But when I am trying to validate them under the save button handler, validateCells() is too slow and first it saves and then validates (even if I await it). So I decided to make validation after editing and changing table structure (removing or adding rows).

[adrian.szymanski]

Hi @matgrabon

I think you can try two things here. First one is to convert rows from visual rows to physical rows (or vice versa) using toVisualRow or toPhysicalRow methods.

You can read more about it here:

• https://handsontable.com/docs/api/core/#tophysicalrow
• https://handsontable.com/docs/api/core/#tovisualrow

The second thing you can try is to set timeout on your saving function so it executes after the validation is done.

[matgrabon]

Thanks Adrian, I am wondering why it happens though. afterRemoveRow’s name would indicate that the row was already deleted, so physical indexing should equal to visual, am I not right? That is why I opened this issue as it seems to me that maybe reindexing does not happen. Or maybe that is my lack of understanding.

Regarding the timeout - I am really hesitant of setting any hard coded value as once I have table of 10 entries, and the other time it would be 500. Is there any hook, or sth that would allow me to actually wait until .validateCells() has finished?

[adrian.szymanski]

Hi @matgrabon

There isn’t such a hook unfortunately. You have to use timeout because validation is asynchronous.

https://jsfiddle.net/x19u53ya/3/

[matgrabon]

Wow, adding setTimout to both afterCreateRow and afterRemoveRow helped and now, the behavior is as expected. Thank you for your help.

[adrian.szymanski]

That’s great to hear! I’m closing the topic then