Extjs 修改时使某些单元格不可编辑

Question

我正在为网格使用 Extjs3.2 和行编辑器插件。我有添加、修改和删除按钮。我在网格中有四个单元格说（id、名字、姓氏、卷号）。如果添加所有字段应该是可编辑的，以便他可以添加所有四个字段。但是假设如果单击一条现有记录并单击修改，我希望 id 字段不可编辑。如何实现这一点

下面是我的代码

var grid= new Ext.grid.GridPanel({
                            store : store_surv,
                            id : "grid_surv",
                            columns : [

                    {
                        header : "Id",
                        width : 120,
                        sortable : true,
                        dataIndex : 'id',
                        renderer: function (value, metaData, record, rowIndex, colIndex, store) {

                             return  getToolTip(value, metaData, record, rowIndex, colIndex, store);
                            } ,
                        editor : {
                            xtype : 'textfield',
                            allowBlank : true
                        }
                    }
                    {
                        header : "First Name",
                        width : 120,
                        sortable : true,
                        dataIndex : 'fname',
                        renderer: function (value, metaData, record, rowIndex, colIndex, store) {

                             return  getToolTip(value, metaData, record, rowIndex, colIndex, store);
                            } ,
                        editor : {
                            xtype : 'textfield',
                            allowBlank : true
                        }
                    }

                    {
                        header : "Last Name",
                        width : 120,
                        sortable : true,
                        dataIndex : 'lname',
                        renderer: function (value, metaData, record, rowIndex, colIndex, store) {

                             return  getToolTip(value, metaData, record, rowIndex, colIndex, store);
                            } ,
                        editor : {
                            xtype : 'textfield',
                            allowBlank : true
                        }
                    },

                   {
                        header : "Roll No",
                        width : 120,
                        sortable : true,
                        dataIndex : 'roll',
                        renderer: function (value, metaData, record, rowIndex, colIndex, store) {

                             return  getToolTip(value, metaData, record, rowIndex, colIndex, store);
                            } ,
                        editor : {
                            xtype : 'textfield',
                            allowBlank : true
                        }
                    }                   ],



                            title : 'Student List',
                            height : 350,
                            width : 750,
                            frame : false
                        })

;

Answer 1

将afteredit 侦听器添加到您的编辑器对象，并在该侦听器中调用 id 文本字段上的setDisabled(true) 方法，如下所示：

var idTextField = Ext.create({
    xtype : 'textfield',
    allowBlank : true
});

var editor = new Ext.ux.grid.RowEditor({
    saveText: 'Update',
    listeners: {
        afteredit: function(){
            idTextField.setDisabled(true);
        }
    }
});

并通过将旧文本字段替换为上述内容来修改现有代码：

...
{
  header : "Id",
  width : 120,
  sortable : true,
  dataIndex : 'id',
  renderer: function (value, metaData, record, rowIndex, colIndex, store) {
                return  getToolTip(value, metaData, record, rowIndex, colIndex, store);
  },
  editor : idTextField
}
...

所以我们只是更改了 editor 属性。