ExtJS 4 RowEditing disable edit on one column based on record

Question

I'm implementing a grid panel with the four last columns editable for most of the rows. The problem is that I'd like to be able to disable editing on, let's say the first one if record.get('status') = 4 which is finalized and only two of the columns should be editable.

Is there a way to disable showing the edit for those rows? I can do it using CellEditing but want to keep using the RowEditing plugin.

Regards, Kristian

Answer 1

Use beforeedit event:

grid.on('beforeedit', function(editor, e) {
  if (e.colIdx === 0 && e.record.get('status') == 4)
    return false;
});

UPDATE
The solution above is not working for rowEditor.
However you can make needed field to be disabled on beforeedit. To do that you should be able to access rowediting plugin. Assign pluginId to plugin:

plugins: [
    Ext.create('Ext.grid.plugin.RowEditing', {
        clicksToEdit: 1,
        pluginId: 'rowEditing'
    })
],

Now just disable needed field if some conditions are met:

grid.on('beforeedit', function(editor, e) {
    if (e.record.get('status') === 4 ){
         grid.getPlugin('rowEditing').editor.form.findField('fieldToDisable').disable();
    }
    else{
        grid.getPlugin('rowEditing').editor.form.findField('fieldToDisable').enable();
   });

Here is demo (try to edit first row).

Edit

If the above JSFiddle does not work, try its updated version.

Answer 2

(based on the previous example) an alternate way is to configure the editor's beforeedit listener:

listeners: {
    beforeedit: function(editor, context) {
        var form   = editor.getEditor().form;
        var field  = form.findField('column_name');
        var status = parseInt(context.record.data.status);
        if (status === 4) {field.disable();} else {field.enable();}
    }
}