View Full Version : Custom Event Help

23 Dec 2010, 12:15 PM
Kinda new to custom events and having an issue getting a listener to work. Let's say I have component A which is to be a reusable paging paging toolbar. And component B is a product list that will consume two of these component A's abouve and below the product listing. What are the exact steps that I need to take to get component A to fire the event 'showMoreItems' such that component B can listen to and respond to the event?

I have done the following things. First off, since the reusable comp A extends the panel which is a descendant of Observable, I get events by default so long as I set them up correctly (or so I think). So I have the following code pieces in comp A:

// Component Init
initComponent: function () {
Ext.apply(this, {
items: [
xtype: 'button',
handler: this.handleEvents

// Add component Events


, handleEvents: function(e){
this.fireEvent('showMoreItems', e.type, e);

Then in comp B I have the following on the config of comp A:

id: 'compA_InstanceName',
xtype: 'compA',
listeners: {
showMoreItems: function (type, e) {
alert('Listen Please!');

I cannot get the listener to work. Debugging shows that compA's handleEvents method is getting called and the fireEvent method as well. So what am I missing here? Do I need to do something else like register the event?

Appreciate ANY help here as I feel that I am close....thanks!

23 Dec 2010, 1:04 PM
Dang it...was the ol' ownerCt that was getting me. Wan not firing the event on the proper container.

Just needed: