Event driven programming in Ext JS

Question

I'm working on an application where different widgets from different plugins would be loaded into a host, and they don't know of each other. So I want to use EDP and in one widget raise an event (for example, UserDeleted) and in another widget, subscribe to that event (the famous publisher/subscriber, or let's get more specific, observer pattern).

In jQuery I use trigger() and bind() methods to accomplish this. However, I'm not able to find anything equivalent in Ext JS. Am I missing something? Or is there any other pattern to create loosely coupled UI widgets in Ext JS?

Answer 1

If your widgets don't know about each other, you need to use the mediator pattern.

And it seems that Ext.util.Observable is what you're looking for.

Answer 2

Since ExtJS 4.x Sencha introduced the concept of Controllers which listen for events in a clean systematic pattern of an MVC application. In this scheme your components would fire events (built in or custom ) and controllers will respond to those events.

To fire a custom event you can use fireEvent method on the Observable class which is inherited by just about all other ExtJS classes.