Handontable:在事件的触发器上设置DataAtCell

Handsontable: setDataAtCell on the trigger of an event

本文关键字：设置 DataAtCell 触发器 事件 Handontable      更新时间：2023-09-26

我是Javascript可手持库的新手，因此，如果这个问题看起来太基本，我深表歉意。

我想做的是，如果有人写入/更改表第一行中写入的数据，则第5列和第5行单元格中的值应设置为"0"；"更改"；。我知道要设置一个值，我需要使用hot.setDataAtCell(5,5,"changed")。我不知道如何触发这个命令，也就是说，我需要找到一种方法来识别列第一行中的任何单元格何时被更改。我尝试过覆盖afterChange回调，但代码一直挂起。

setDataAtCell()似乎在afterChange回调函数中不起作用。

这样做的方法是在初始化手可接触数据时为数据使用初始化的变量，如data:mydata，然后afterChange函数应如下所示：

afterChange: function (changes, source) {
    mydata[5][5]="changed";
    this.render();
}

这应该可以解决您的问题，

示例：

 var cellChanges = [];
$(document).ready(function () {
    var myData = [{
        0: 'aaaaaaaaaaaaa',
        1: 'bbbbbbbbb',
        2: 'ccccccc'
    }, {
        0: 'aaaa',
        1: 'b',
        2: 'bbbb'
    }, {
        0: 'aaaa',
        1: 'x',
        2: 'bbbb'
    }, {
        0: 'aaaa',
        1: 'w',
        2: 'bbbb'
    }, ];
    $("#editOrders").handsontable({
        data: myData,
        autoWrapRow: true,
        minSpareRows: true,
        columnSorting: true,
        fillHandle: false,
        currentRowClassName: 'currentRow',
        colHeaders: ["demo", "demo", "demo"],
        afterChange: function (changes, source) {
            if (!changes) {
                return;
            }
            $.each(changes, function (index, element) {
                var change = element;
                var rowIndex = change[0];
                var columnIndex = change[1];
                var oldValue = change[2];
                var newValue = change[3];
                var cellChange = {
                    'rowIndex': rowIndex,
                    'columnIndex': columnIndex
                };
                if(oldValue != newValue){
                    cellChanges.push(cellChange);
                }
            });
        },
        afterRender: function () {
            var instance = $('#editOrders').handsontable('getInstance');
            $.each(cellChanges, function (index, element) {
                var cellChange = element;
                var rowIndex = cellChange['rowIndex'];
                var columnIndex = cellChange['columnIndex'];
                var cell = instance.getCell(rowIndex, columnIndex);
                var foreColor = '#000';
                var backgroundColor = '#ff00dd';
                cell.style.color = foreColor;
                cell.style.background = backgroundColor;
            });
        },
        columns: [{
            //LINE
            data: 0
        }, {
            //LINE
            data: 1
        }, {
            //LINE
            data: 2
        },
        ]
    });
});

这里是jsfiddle的链接
http://jsfiddle.net/8hv4z/18/

相关文章：