2012-09-28 58 views
0

ExtJS4:我在将应用程序ExtJs版本从3.4.0升级到4.1.1a时遇到问题。ExtJs3.4.0到ExtJs4.1.1升级问题

我的3.4.0版本代码:

this.jsonStore = new Ext.data.JsonStore({ 
     proxy : new Ext.data.HttpProxy({ 
     url: 'rs/environments', 
     disableCaching: true 
     }), 
    restful : true, 
    storeId : 'Environments', 
    idProperty: 'env', 
    fields : [ 
     'ConnectionName', 'Type' 
    ] 
}); 

this.colmodel = new Ext.grid.ColumnModel({ 
    defaults: { 
     align: 'center' 
    }, 
    columns: [{ 
        header: Accero.Locale.text.adminlogin.connectionsHeading, 
        width : 140, 
        dataIndex: 'ConnectionName' 
      }, 
      { 
        header: Accero.Locale.text.adminlogin.connectionTypeHeader, 
        width : 120, 
        dataIndex: 'Type' 
      }] 
}); 

config = Ext.apply({ 
    enableHdMenu: false, 
    border  : true, 
    stripeRows : true, 
    store  : this.jsonStore, 
    view  : new Ext.grid.GridView(), 
    header  : false, 
    colModel : this.colmodel, 
    sm   : new Ext.grid.RowSelectionModel({singleSelect: true}), 
    loadMask: { 
      msg: Accero.Locale.text.adminlogin.loadingmask 
      } 
}, config); 

我改变下面进行,以与ExtJs4.1.1应用工作:

var sm = new Ext.selection.CheckboxModel({ 
     listeners:{ 
      selectionchange: function(selectionModel, selected, options){ 
       // Must refresh the view after every selection 
       myGrid.getView().refresh(); 
       // other code for this listener 
      } 
     } 
    }); 

    var getSelectedSumFn = function(column){ 
     return function(){ 
      var records = myGrid.getSelectionModel().getSelection(), 
      result = 0; 
      Ext.each(records, function(record){ 
       result += record.get(column) * 1; 
      }); 
      return result; 
     }; 
    } 


    var config = Ext.create('Ext.grid.Panel', { 
     autoScroll:true, 
     features: [{ 
      ftype: 'summary' 
     }], 
     store: this.jsonStore, 
     defaults: {    // defaults are applied to items, not the container 
      sortable:true 
     }, 
     selModel: sm, 
     columns: [ 
      {header: Accero.Locale.text.adminlogin.connectionsHeading, width: 140, dataIndex: 'ConnectionName'}, 
      {header: Accero.Locale.text.adminlogin.connectionTypeHeader, width: 120, dataIndex: 'Type'} 
     ], 
     loadMask: { 
      msg: Accero.Locale.text.adminlogin.loadingmask 
      }, 
     viewConfig: { 
      stripeRows: true 
     } 
    }, config); 

有了这些变化,我得到的错误在我的地方文件'ext-override.js'说'this.el未定义'。

我调试了代码,发现在当前对象中没有el对象。

EXT-override.js代码:

(function() { 
    var originalInitValue = Ext.form.TextField.prototype.initValue; 
    Ext.override(Ext.form.TextField, { 
      initValue: function() { 
       originalInitValue.apply(this, arguments); 
       if (!isNaN(this.maxLength) && (this.maxLength *1) > 0 && (this.maxLength != Number.MAX_VALUE)) { 
        this.el.dom.maxLength = this.maxLength *1; 
       } 
      } 
     } 
    ); 
})(); 

请建议我要去哪里错了?

在此先感谢...

回答

0

说真的,使用更懒惰的初始化!你的代码是一堆对象,都是非结构化的。

首先,你可以重写,并与类似的东西(自4​​.1)

Ext.override('My.Override.for.TextField', { 
    override : 'Ext.form.TextField', 
    initValue: function() { 
    this.callOverridden(arguments); 
    if (!isNaN(this.maxLength) && (this.maxLength *1) > 0 && (this.maxLength != Number.MAX_VALUE)) { 
     this.el.dom.maxLength = this.maxLength *1; 
    } 
    } 
}); 

但更方便的使用重载方法:方法initValue被称为initField(和这在initComponent),因此您不能参考this.me,因为组件实际上未(完全)呈现。

所以,这应该帮助(未测试):

Ext.override('My.Override.for.TextField', { 
    override : 'Ext.form.TextField', 
    afterRender: function() { 
    this.callOverridden(arguments); 
    if (!isNaN(this.maxLength) && (this.maxLength *1) > 0 && (this.maxLength != Number.MAX_VALUE)) { 
     this.el.dom.maxLength = this.maxLength *1; 
    } 
    } 
}); 

但我强烈建议不要覆盖范围内使用这样的事情。制作可提高代码可读性的专用组件。