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

Question

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

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

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

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

示例：在第一行：第 1 列具有值（默认情况下），并且用户 select 来自第 2 列下拉列表中的一个项目。只有这样他才能 select 一个第三列下拉列表中的项目。用户无法 select 其他行的第三列中的项目，因为他们的第二列是空的。

Answer 1

您可以动态处理 editable 模式

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

Set to true if this col is editable, otherwise false. Can also be a function to have different rows editable.

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

Set to true to enable Single Click Editing for cells, to start editing with a single click. See Single Click Editing. Default: false

Answer 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;
    }

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

ag-grid: Disable cells based on content in other cells on the same row

ag-grid

angular