ExtJS 4 RowEditing根据记录禁用一列的编辑

时间:2011-10-06 19:21:39

标签: grid extjs4

我正在实现一个网格面板,其中最后四列可编辑为大多数行。问题是我希望能够禁用编辑,假设第一个如果record.get('status')= 4,那么最终确定并且只有两列可以编辑。

有没有办法禁止显示这些行的编辑?我可以使用CellEditing来做,但想继续使用RowEditing插件。

此致 克里斯蒂安

3 个答案:

答案 0 :(得分:38)

使用beforeedit事件:

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

<强>更新
上面的解决方案不适用于rowEditor 但是,您可以在beforeedit上禁用所需的字段。为此,您应该能够访问rowediting插件。将pluginId分配给插件:

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

现在,如果满足某些条件,只需禁用所需的字段:

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();
   });

这是demo(尝试编辑第一行)。

修改

如果上述JSFiddle不起作用,请尝试its updated version

答案 1 :(得分:1)

(基于前面的示例)另一种方法是配置编辑器的beforeedit侦听器:

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();}
    }
}

答案 2 :(得分:-2)

由于@Molecular Man的回答使得禁用列在编辑编辑时看起来很有趣我想到了另一种看起来很完美的方式。 您所要做的就是创建一个函数,例如:

function fieldFormat() {
    if(isGuest) {
        return null; //is not editable
    } else {
        //how you want the column's field config to be formated
        var json = Ext.JSON.decode("{xtype: 'textfield',maxLength: 40}");
        return json;
    }
}

并在网格中,你输入这样的东西:

var grid = Ext.create('Ext.grid.Panel', {
    plugins: [grid_rowEditing],
    store: store,
    columns: [
    {
        text     : 'Name',
        dataIndex: 'name',
        field    : fieldFormat()
    }]
});

isGuest 为true时,字段'name'将不可编辑。当它为假时,它将是可编辑的