编辑可操作网格的单元格属性

Question

我有一个 Handsontable 网格，用户可以在其中输入一些值以将它们插入到数据库中。当他提交网格时，我希望特定单元格为 "readOnly"。在这种情况下，我希望第一列是 "readOnly".

我使用 Ajax 将我的数据发送到我的数据库中。在我的回调函数中，我想将单元格属性编辑为 "readOnly"。

所以我现在有的是：

var cellProperties={};
    var i;
    for (var i = 0; i < data_traitement.length; i++) {

        cellProperties.readOnly = true;
        return cellProperties;
    }

但是"cellProperties"选项只能在Handsontable定义中使用。所以我不知道用什么来做这个。

有人可以帮我吗？

编辑：

在 ZekeDroid 的建议下，我尝试修改我的单元格定义：所以我得到了这个：

cells:function(row,col,prop){
    var cellProperties = {};

    if ([0].indexOf(row) !== -1 && col >= 0) 
    {
        cellProperties.readOnly = true;
    }

    if (readOnlyCells[[row,col]]) {
        cellProperties.readOnly = true;
    }

    return cellProperties;
    }

在我的回调函数中，如果我理解得很好，我必须将这个readOnlyCells更改为true。

所以我做了这个：

for (var i = 0; i < data_traitement.length; i++) {
        readOnlyCells[[i,0]] = true; //I'm not sure of this line

    }
    hot.render();

Answer 1

如果您设置了 columns 选项，您应该使用 HOT 实例和函数 updateSettings() 简单地更新选项。它会像这样工作：

hot.updateSettings({
    columns: newColumns
});

在您的情况下，newColumns 应该是您列的新定义。我建议创建一个 returns 这个新对象的函数。该对象将在文档页面中定义。在您的 ajax 回调中，您将确保这个新定义的第一列是 readOnly:true，然后您就完成了！

如果你只想做细胞，可能比这更容易。您可以像这样保留单元格坐标图：

var readOnlyCells = {};

然后在您的回调中，添加键值对单元格坐标：readOnlyCells[[row,col]] = true。在此之后，您应该确保您的初始 cells 定义如下：

cells: function(row, col, prop) {
    var cellProperties = {};

    if (readOnlyCells[[row,col]]) {
        cellProperties.readOnly = true;
    }

    return cellProperties;
}

就是这样。您可能希望像更新列一样更新设置，但无需更改代码。

Answer 2

您可以尝试为此专栏实现自定义渲染器吗？然后您可以控制该列中每个单元格的只读。

示例：

function customReadOnlyRenderer(instance, td, row, col, prop, value, cellProperties) {

    // your business logic to determine read only property of the cell
    cellProperties.readOnly = true or false;
    Handsontable.TextCell.renderer.apply(this, arguments);
}

在 ajax 调用之后，您更新数据源并调用渲染。将使用来自源的最新数据为此列上的每个单元格调用渲染器。

编辑可操作网格的单元格属性

Edit cell properties of a handsontable grid

javascript

handsontable