PDA

View Full Version : [CLOSED] [3.??] Ext.getCmp() bug with ComboBoxes



mschwartz
8 May 2009, 10:28 AM
I create a ComboBox either by xtype or by new Ext.form.Combo(), with id: 'some_unique_id'.

At create time using Ext.form.Combo(), I examine the object returned, and it sure does appear to be a ComboBox.

However, in an event handler, I do:
var cmp = Ext.getCmp('some_unique_id');

Examine the object returned, and it's something else, a child of the combo:
cmp.id: 'some-unique-id'
cmp.dom.className: 'x-form-text x-form-field'
cmp.dom.nodeName: "INPUT"

&c

The problem is, this cmp returned has no markInvalid() method, but the one returned by the construction does.

evant
8 May 2009, 8:06 PM
Can you post the console.logs() for both upon construction and using getCmp?

mschwartz
11 May 2009, 4:55 AM
Can you clarify the question?

There are no console.log() calls in the code that I know of. I'm setting breakpoints with firebug and examining what getCmp() returns if I use an xtype construction and examining the variable if I construct with the new operator. I posted what I see in my first post, when I do getCmp(). Using the new construction, I get a variable pointing at a valid combo that I can call markInvalid() on just fine.

To be more clear...



var form = new Ext.form.FormPanel({
...
{
xtype: 'combo',
id: 'unique_id',
...
}
...
});

var combo = Ext.getCmp('unique_id');




combo points at something not a combo.

Examine the object returned, and it's something else, a child of the combo:
cmp.id: 'some-unique-id'
cmp.dom.className: 'x-form-text x-form-field'
cmp.dom.nodeName: "INPUT"
(has no markInvalid method)

If I do this instead:



var combo = new Ext.form.ComboBox({
...
});
var form = new Ext.form.FormPanel({
...
items: [
combo
...
]
});


combo points at a valid combo box.
(has a markInvalid method)

Animal
11 May 2009, 5:23 AM
To debug, add an interceptor to Ext.ComponentMgr.register and break or alert if something ever overrides that id with some other object

evant
11 May 2009, 8:49 AM
Definitely cannot reproduce this:



Ext.onReady(function() {
var cmb = new Ext.form.ComboBox({
triggerAction: 'all',
id: 'foo',
store: [1, 2, 3],
renderTo: document.body
});

var x = Ext.getCmp('foo');
console.log(cmb == x);
});

mschwartz
11 May 2009, 11:50 AM
You using rc1?

aconran
12 May 2009, 9:44 AM
Tried to reproduce this in several different variants under the latest SVN and was unable to reproduce it.

mschwartz
12 May 2009, 9:51 AM
Definitely cannot reproduce this:



Ext.onReady(function() {
var cmb = new Ext.form.ComboBox({
triggerAction: 'all',
id: 'foo',
store: [1, 2, 3],
renderTo: document.body
});

var x = Ext.getCmp('foo');
console.log(cmb == x);
});


That's not the case that fails for me.

More like:



var form = new Ext.form.FormPanel({
items: [
{
xtype: 'combo',
id: 'foo',
... (other options)
}
],
tbar: new Ext.Toolbar({
items: [
{
text: 'click me',
handler: function() {
console.dir(Ext.getCmp('foo')); // not a combo for me
}
}
]
})
});

aconran
12 May 2009, 10:02 AM
Tried again with something similar to what you posted and was unable to reproduce. Can you zip up your version and send it to me and/or put it in a hosted environment i can debug?

mschwartz
12 May 2009, 10:14 AM
I wish it were easy to do. My app is 17,000 lines of javascript and extracting just a piece of it isn't trivial. I'm also not at liberty to show the app, I'd need permission to do that.

I can be more specific.

The button is in the fbar of a dialog window, not a tbar. I thought maybe the tbar button would do the trick.

A snippet of the code making the combo:



{
xtype: 'combo',
id: 'datasource-' + id,
fieldLabel: 'Data Source',
store: this.tablestore,
valueField: 'nodeid',
displayField: 'title',
msgTarget: 'side',
listeners: {
render: function() {
this.store.on('load', function() {
this.setValue(p.datasource || 'Choose Table');
}, this);
this.store.load();
}
}
}
The snippet of code doing the getCmp():



var cmp = Ext.getCmp('datasource-'+id);
if (cmp.getValue() == 'Choose Table') {
cmp.markInvalid('You must choose a data source'); // firebug stops here, cmp.markInvalid is undefined
valid = false;
}
id is a unique number.

Animal
12 May 2009, 2:02 PM
I really recommend adding an interceptor to ComponentMgr.register which pops up an alert on registration of a Component id that is already registered.