Handsontable 更改列源答案

【问题标题】：Handsontable change a column sourceHandsontable 更改列源
【发布时间】：2016-04-08 03:20:02
【问题描述】：

是否可以在事件中更改 Handsontable 实例中的源？

下面是我的代码：

var container2 = $('#example2');

var hot2 = new Handsontable(container2, {
    data: {},
    minRows: 5,
    colHeaders: ['Car', 'Year', 'Car Color'],
    columns: [
        {
            type: 'autocomplete',
            source: ['BMW', 'Chrysler', 'Nissan', 'Suzuki', 'Toyota', 'Volvo'],
            strict: true,
            allowInvalid: false
        }, ,
        {},
        {
            type: 'autocomplete',
            source: ['yellow', 'red', 'orange', 'green', 'blue', 'gray', 'black', 'white', 'purple', 'lime', 'olive', 'cyan'],
            strict: true,
            allowInvalid: false
        }]
});

Handsontable.hooks.add('afterChange', afterChangedCallback, hot2);

function afterChangedCallback(p) {
    console.log(p);
    if (p[0][1] == 0) {
        alert('This means the first column has changed, I now want to update the colors here');
    }
}

当用户选择不同的汽车品牌时，我只想用某些颜色填充“汽车颜色”的下拉菜单。因此，并非所有汽车品牌都有相同的颜色。

编辑

我根据接受的答案更新了回调函数：

function afterChanged(p) {
    console.log(p);
    if (p[0][1] == 0) {
        hot2.updateSettings({
            cells: function (row, col, prop) {
                if (row == p[0][0] && col == 2) {
                    var cellProperties = {};

                    cellProperties.source = ['red', 'yellow', 'blue'];

                    return cellProperties;
                }
            }
        });

    }
}

【问题讨论】：

标签： handsontable

【解决方案1】：

是的，您可以使用updateSettings 方法来更改整个列或特定单元格的来源。你可能想要每个单元格，所以我会这样做：

hot.updateSettings({
    cells: newCellDefinitionFunction()
})

当然，这个新定义由您自己决定。它可能只是每次都返回相同的cellProperties，但检查一些全局数组以了解哪些源用于哪些单元格。

【讨论】：