Handsontable - afterChangeEvent如何检测整行何时被删除或添加

Question

我已经创建了一个自定义函数，该函数根据以下Handsontable链接中的说明在afterChange单元事件上执行。

https://docs.handsontable.com/0.15.0-beta3/Hooks.html

而且我可以根据被更改精每个单元执行操作。根据以下代码。

var hot = new Handsontable(container, { 
    data: data(), 
    minSpareRows: 1, 
    rowHeaders: true, 
    colHeaders: ['some array of headers'] 
    afterChange: function (changes, source) { 
      onChangeHandler(this, changes, source); 
     } 
}); 

var onChangeHandler = function (hot_instance, changes, source) { 
     var changesLength; 
     var changePayloadtoServer = []; 
     if (changes != null) { 
     changesLength = changes.length; 
     } else { 
     changesLength = 0; 
     } 
     for (var i = 0; i < changesLength; i++) { 
     var row = changes[i][0], 
      col = changes[i][1], 
      oldVal = changes[i][2], 
      newVal = changes[i][3], 

     var trigger = false 

     // How to I determine that a whole row has been deleted/added here? 
     // trigger = some check that a whole row has been deleted/added. 

     if (trigger == true) { 
      // Perform action on row deletion 
      // i.e. CASCADE DELETE query on database 

      // Perform action on row addition 
      // i.e. INSERT INTO query on database 
     } else { 
      // Perform normal on cell change 
      // i.e. UPDATE query on database 

     } 

     } 

} 

但是，我无法弄清楚如何确定整个行已被删除或添加的变化。鉴于此afterChange事件中提供的更改数据的格式如下：

[ 
{changedRowNumber, chnagedColumnName, oldCellValue, newCellValue} 
, {changedRowNumber, chnagedColumnName, oldCellValue, newCellValue} 
, {changedRowNumber, chnagedColumnName, oldCellValue, newCellValue} 
, {changedRowNumber, chnagedColumnName, oldCellValue, newCellValue} 
, ... etc. 
] 

我已经创建了一个示例小提琴。请参阅以下链接。

https://jsfiddle.net/JoshAdams/go898kq6/

有谁知道什么时候一整排被添加或删除我如何检测？

Answer 1

你要寻找的是另两个事件的文件中也规定：

• afterCreateRow
• afterRemoveRow

正如你可以想像，你将不得不defiene这两个事件在你的可移动配置中，而不是在afterChange事件中。

例如，看你JSFiddle编辑：

afterRemoveRow: function (index, amount) { 
    console.log(amount + " row(s) removed starting line "+ index) 
}, 
afterCreateRow: function (index, amount) { 
    console.log(amount + " row(s) added starting line "+ index) 
}, 

---

编辑：基于您的评论，我做了一个例子，你想要的情况;知道变更后行的每个值何时变空。 你可以找到一个新的简化JSFiddle here方含以下改动后的事件定义：

hot.addHook('afterChange', function(changes) { 
    if (!changes) { 
    return; 
    } 
    $.each(changes, function (index, element) { 
    var 
    rowEmpty = true, 
    row = element[0], 
    currentRowArray = hot.getData(row,0,row,hot.countCols()); 

    for(var i=0; i<currentRowArray[0].length-1; i++) { 
     if(currentRowArray[0][i] != "") { 
     rowEmpty = false; 
     break; 
     } 
    } 

    if(rowEmpty) { 
     console.log("Row " + row + " is empty !"); 
    } 
    }); 
}); 

每一次变化是在细胞制成，该事件中的代码将检查是否有同一行的至少一个细胞其中包含一个值（如果看到一个值，则结束该事件）。如果不是，则在控制台中打印该行为空。因此，您要查找的结果是布尔型rowEmpty。

另外，还要注意两点：

1. jQuery的功能$。每个允许你做它的工作原理，当用户空两个（或更多）排在同一时间。

2. 该-1条件的为循环。如果你想比较你的数组的长度和列的数量，不要忘记列的数量显然不会从0开始计数。所以如果有6列，这将是列0到5，因此-1。