ag-grid：根据同一行其他单元格中的内容禁用单元格答案

【问题标题】：ag-grid: Disable cells based on content in other cells on the same rowag-grid：根据同一行其他单元格中的内容禁用单元格
【发布时间】：2019-04-05 16:23:10
【问题描述】：

我正在寻求有关我将使用 ag-grid 实现的功能的帮助。 Here 是个笨蛋。

我有一个包含 X 项和 3 列的表。在第一列中，我有一些只读文本，在第二列和第三列中，我有自定义cellEditor（单击时会显示下拉菜单）。

目标：我希望默认情况下禁用第三列中的单元格（单击时，不显示下拉列表），并且仅当第二列中的单元格显示下拉列表（在第三列中的单元格中）同一行有值（从下拉列表中选择一个项目）。

enter code here (must have code in order to put plunker links :/)

示例：在第一行：第 1 列有值（默认情况下），用户从第 2 列的下拉列表中选择一个项目。然后，只有这样，他才能从第三列的下拉列表中选择一个项目。用户无法从其他行的第三列中选择项目，因为它们的第二列是空的。

【问题讨论】：

标签： angular ag-grid

【解决方案1】：

你可以动态处理editable模式

headerName: 'C',
field: 'c',
cellEditor: 'searchEditor',
editable: (params:IsColumnFuncParams)=>{ return params.data.b },
cellEditorParams: {
    values: this.c
}

如果此 col 可编辑，则设置为 true，否则设置为 false。也可以是可编辑不同行的函数。

editable?: boolean | IsColumnFunc;

ag-grid-community\src\ts\entities\colDef.ts

export interface IsColumnFuncParams {
    node: RowNode;
    data: any;
    column: Column;
    colDef: ColDef;
    context: any;
    api: GridApi;
    columnApi: ColumnApi;
}

更新：singleClickEdit

设置为true 为单元格启用Single Click Editing，单击即可开始编辑。见Single Click Editing。 Default: false

【讨论】：

投票，因为这实际上解决了相关问题。另一个值得一提的注意事项是，“可编辑”是在单元格被编辑时随时触发的回调。一开始我以为这只会在列设置上发生一次，但是，我很高兴地说情况并非如此。很好的解决方案！
抑制点击编辑

【解决方案2】：

只是为了扩展 AlexRebula 的出色技巧，以下是您可以做的事情，editable：

header: 'username',
editable: (params:IsColumnFuncParams)=> { return this.canCellBeEdited(params) },
cellRenderer: 'searchEditor',

. . . 

    canCellBeEdited(params) {
        //  Don't let the user edit the "First Name" cell, if the current value is "mike".
        if (params.colDef.field == 'firstName' && params.data[params.colDef.field] == 'mike') {
            return false;
        }
        return true;
    }

【讨论】：