Search code examples
extjsextjs4extjs5

ExtJs cell editing


I have a grid with 3 columns and 5 rows.

I have attached a CellEditing plugin to the grid. And for the 3rd column i have defined an numberfield editior.

So now due to this each row 3rd column has a numberfield editor attached to it.

But due to some condition present in data/column metadata, i want to disable the numberfield editor for 2nd and 4th row.

I am unable to disable cell editor for particular rows as the editor is attached at the column level.

Is there a way in ExtJS to handle this kind of scenario.

I am using ExtJS 5.


Solution

  • As noted in the comments by Evan, you need to use the beforeedit event to veto the edit before it starts.

    ExtJS does not attach an editor to every cell. Instead, when the user triggers the edit (e.g. by single- or double-clicking on the grid cell), the CellEditing plugin will be invoked. If the beforeedit event is not vetoed, it will then attach the edit field to the cell in place. When the edit is finished, the edit field will be detached.

    If you want to style the non-editable fields differently, to help indicate that they are not editable, the column can be assigned a renderer, which will allow you to provide cell-specific attributes, including CSS style.