EXT JS如何使cellmodel不可编辑？

Question

Ext.define('RouteFareModel', { 
     extend: 'Ext.data.Model', 
     fields: [ 
     {name: 'Rate_ID', type: 'number'}, 
     {name: 'Route_Fare' , type: 'int'}, 
     'From_LocationName', 
     'To_LocationName', 
     'From_LocationID', 
     'To_LocationID', 
     'from_name', 
     'to_name', 
     'Route_ID', 
     'Normal_Rate', 
     'Discounted_Rate'] 
    }); 

    var RouteFareStore = Ext.create('Ext.data.JsonStore', { 
     model: 'RouteFareModel', 
     storeId: 'RouteFareStore', 
     autoLoad: false, 
     sorters: [{ 
        property: 'Route_Fare', 
        direction: 'ASC' 
       }], 
     proxy: { 
      type: 'ajax', 
      url: 'get-routefare.php', 
      api: { 
        create: 'insert-routeseq.php', 
        //read: 'http://visual04/ModuleGestion/php/Pays.php?action=read', 
        update: 'update-routeseq.php', 
        //destroy: 'http://visual04/ModuleGestion/php/Pays.php?action=destroy' 
       }, 
      actionMethods: 'POST', 
      baseParams: { 
        _id : 0, 
       }, 
      reader: { 
       type: 'json', 
       idProperty: '_id' 
      }, 
      writer: { 
       type: 'json', 
       id: '_id' 

      } 
     } 
    }); 

var cellEditing = Ext.create('Ext.grid.plugin.CellEditing', { 
     clicksToEdit: 1 
    }); 

Ext.define('MyApp.view.MyGridPanelRouteFare', { 
    extend: 'Ext.grid.Panel', 
    id:'MyGridPanelRouteFare', 
    alias: 'widget.mygridpanelroutefare', 
    renderTo: Ext.getBody(), 
    height: window.innerHeight, 
    width: window.innerWidth/3, 
    title: 'Route Fare Setting', 
    selModel: { 
      selType: 'cellmodel' 
     }, 
    plugins: [cellEditing], 
    store: RouteFareStore, 
    columns: [ 
     { 
      xtype:'gridcolumn', 
      width: 120, 
      dataIndex: 'from_name', 
      text: 'From Location' 
     }, 
     { 
      xtype:'gridcolumn', 
      width: 120, 
      dataIndex: 'to_name', 
      text: 'To Location' 
     }, 
     { 
      xtype:'gridcolumn', 
      width: 80, 
      dataIndex: 'Normal_Rate', 
      text: 'Normal Rate' 
     }, 
     { 
      xtype:'gridcolumn', 
      width: 80, 
      dataIndex: 'Discounted_Rate', 
      text: 'Discount Rate' 
     } 
    ], 
    dockedItems: [ 
     { 
      xtype: 'toolbar', 
      dock: 'top', 
      height: 30, 
      items: [ 
       { 
        xtype: 'combobox', 
        id:'cmbFareRouteID', 
        width: 191, 
        store: RouteNameStore, 
        valueField : "_id", 
        displayField : "Route_Code", 
        fieldLabel: 'Route Code', 
        labelWidth: 70, 
        editable: false, 
        queryMode: 'local', 
        listeners: { 
            select: function(combo, records, eOpts) { 
            console.log("Combo selected _id : "+records[0].get('_id')); 
            RouteFareStore.load({ 
               params:{ 
                _id: records[0].get('_id') 
               } 
              }); 
            } 
           } 
       }, 
       { 
        xtype: 'button', 
        cls: '', 
        id: 'BtnFareCmbRefresh', 
        width: 65, 
        icon: '', 
        iconCls: 'refresh', 
        text: 'Refresh' 

       } 
      ] 
     }, 
     { 
      xtype: 'toolbar', 
      dock: 'top', 
      height: 30, 
      items: [ 
       { 
        xtype: 'button', 
        cls: '', 
        id: 'BtnRouteFareSave', 
        width: 65, 
        icon: '', 
        iconCls: 'save', 
        text: 'Save' 
       },    
       { 
        xtype: 'button', 
        cls: '', 
        id: 'BtnRouteFareRefresh', 
        width: 65, 
        icon: '', 
        iconCls: 'refresh', 
        text: 'Refresh' 
       } 
      ] 
     } 
    ] 
}) 

我有加
var cellEditing = Ext.create('Ext.grid.plugin.CellEditing', { clicksToEdit: 1 });

但网格细胞仍无法编辑。为什么？

Answer 1

{ 
      xtype:'gridcolumn', 
      width: 80, 
      dataIndex: 'Normal_Rate', 
      text: 'Normal Rate', 
      field: { 
       xtype: 'numberfield', 
       allowBlank: false, 
       minValue: 0, 
       maxValue: 1000 
      } 
     }, 

必须插入field: {}，那么cellmodel已经可以编辑了。