javascript - Error trying to extend ExtJs ComboBox - "Cannot read property 'dom' of null"? - S

admin管理员组

文章数量:1312985

I'm using ExtJs4 and I'm trying to extend the Ext.form.field.ComboBox like below:

Ext.define('GenericCombo', {
  extend: 'Ext.form.field.ComboBox',
  alias: 'widget.genericbo',

  //the constructor
  constructor: function(config) {

    var store = new Ext.data.JsonStore({
        fields: ['Key', 'Value'],
        data : configbodata || []
    });//new Ext.data.Store

    Ext.apply(this, config, {
        store: store,
        displayField: 'Value',
        valueField: 'Key',
        queryMode: 'local',
        emptyText:'Select a value...'
    });

    this.callParent([this]);

  }//end constructor

});//end Ext.define

The data for the store i.e. configbodata is returned in JSON format like below:

"bodata":[
            {"Key":"","Value":"<None>"},
            {"Key":"!#","Value":"Dr"},
            {"Key":"!$","Value":"Miss"}
        ]

However I get an error on line 61312 of ext-all-debug.
(inside the renderActiveError method).

Error: Uncaught TypeError: Cannot read property 'dom' of null

Line 61312 :

me.errorEl.dom.innerHTML = activeError;

Am I missing something obvious here?

EDIT: Adding some code where I instantiate it:
I actually instantiate the bobox dynamically i.e. The server returns some extjs code dynamically in JSON format like below:

 {
    "anchor":"50%",
    "autoScroll":false,
    "border":false,
    "bodata":[
          {"Key":"","Value":"<None>"},
          {"Key":"!#","Value":"Dr"}
        ],
    "fieldLabel":"Title",
    "name":"3820",
    "value":"!)",
    "xtype":"genericbo"
 }

However When i try to hardcode it i get the same error. Hardcoded example:

            xtype: 'form',
            title: 'A Form',
            items:[{
                     xtype: 'genericbo',
                     fieldLabel: 'Test',
                     bodata: [{Key: 'one', Value: 'two'}]
                  }]

I'm using ExtJs4 and I'm trying to extend the Ext.form.field.ComboBox like below:

Ext.define('GenericCombo', {
  extend: 'Ext.form.field.ComboBox',
  alias: 'widget.genericbo',

  //the constructor
  constructor: function(config) {

    var store = new Ext.data.JsonStore({
        fields: ['Key', 'Value'],
        data : config.bodata || []
    });//new Ext.data.Store

    Ext.apply(this, config, {
        store: store,
        displayField: 'Value',
        valueField: 'Key',
        queryMode: 'local',
        emptyText:'Select a value...'
    });

    this.callParent([this]);

  }//end constructor

});//end Ext.define

The data for the store i.e. config.bodata is returned in JSON format like below:

"bodata":[
            {"Key":"","Value":"<None>"},
            {"Key":"!#","Value":"Dr"},
            {"Key":"!$","Value":"Miss"}
        ]

However I get an error on line 61312 of ext-all-debug.
(inside the renderActiveError method).

Error: Uncaught TypeError: Cannot read property 'dom' of null

Line 61312 :

me.errorEl.dom.innerHTML = activeError;

Am I missing something obvious here?

EDIT: Adding some code where I instantiate it:
I actually instantiate the bobox dynamically i.e. The server returns some extjs code dynamically in JSON format like below:

 {
    "anchor":"50%",
    "autoScroll":false,
    "border":false,
    "bodata":[
          {"Key":"","Value":"<None>"},
          {"Key":"!#","Value":"Dr"}
        ],
    "fieldLabel":"Title",
    "name":"3820",
    "value":"!)",
    "xtype":"genericbo"
 }

However When i try to hardcode it i get the same error. Hardcoded example:

            xtype: 'form',
            title: 'A Form',
            items:[{
                     xtype: 'genericbo',
                     fieldLabel: 'Test',
                     bodata: [{Key: 'one', Value: 'two'}]
                  }]

• javascript
• extjs
• null
• extjs4

Share Improve this question Follow edited May 30, 2011 at 16:31 shane87 asked May 30, 2011 at 16:00 shane87shane87 3,1201313 gold badges5252 silver badges6565 bronze badges 2

• can you show the code where you're instantiating it? – JamesHalsall Commented May 30, 2011 at 16:16
• @Jaitsu: I have added some more code to my original question explaining how I instantiate it.. – shane87 Commented May 30, 2011 at 16:32

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 3

I was calling

this.callParent([this]); //Which is wrong and caused my error.

The correct way is to call

this.callParent([arguments]);

Try this... move everything in your constructor to the initComponent method. Then in your constructor you need to call the parent's constructor...

constructor : function(config) {
   GenericCombo.superclass.constructor.apply(this,new Array(config);
}

I would also consider namespacing your ponent... something like Ext.ux.GenericCombo would be better suited.

本文标签： javascriptError trying to extend ExtJs ComboBoxquotCannot read property 39dom39 of nullquotStack Overflow