PDA

View Full Version : [FIXED] Accessing DOM events directly from a child element of a Component



ykey
21 Mar 2011, 5:05 PM
Cross post from 4.x Help where I didn't get a response.

I am having trouble binding two different DOM event listeners to the same element.

In the following code example, the only event that fires is the mouseout event. If I remove the mouseout listener the mouseover listener fires correctly. It appears that the last one wins.

Should I not be able to bind two different DOM events to the same element or is this a bug?



Ext.define('Square', {
extend: 'Ext.panel.Panel',
alias: 'widget.square',

initComponent: function(){
Ext.apply(this, {
width: 50,
height: 50,
listeners : {
mouseover: {
element : 'el',
fn : function(event, el) {
console.log('over', arguments);
Ext.get(el).addCls('highlight');
}
},
mouseout: {
element : 'el',
fn: function(event, el) {
console.log('out', arguments);
Ext.get(el).removeCls('highlight');
}
}
}
});

this.callParent(arguments);
}
});

Ext.onReady(function() {
Ext.create('widget.square', {
renderTo: Ext.getBody()
});
});

Jamie Avins
22 Mar 2011, 12:24 PM
This is a bug, we'll keep this thread updated with the progress.

mberrie
7 Aug 2011, 9:32 PM
Has long been fixed. [FIXED-EXTJSIV-1938] and works in 4.0.2a

http://www.sencha.com/forum/showthread.php?133358-FIXED-EXTJSIV-1938-4.0.0-el-binding-only-allows-for-one-listener-per-element