Custom Events Plugin Pattern With The Widget Factory

Custom Events Plugin Pattern With The Widget Factory

From Learning JavaScript Design Patterns, a book by Addy Osmani.

In the JavaScript Design Patterns section of the book, we discussed the Observer pattern and later went on to cover jQuery's support for custom events, which offer a similar solution for implementing Publish/Subscribe. This same pattern can be used when writing jQuery plugins.

The basic idea here is that objects in a page can publish event notifications when something interesting occurs in our application. Other objects then subscribe to (or listen) for these events and respond accordingly. This results in the logic for our application being significantly more decoupled, as each object no longer needs to directly communicate with another.

In the following jQuery UI widget factory pattern, we’ll implement a basic custom event-based Publish/Subscribe system that allows our plugin to subscribe to event notifications from the rest of our application, which will be responsible for publishing them.

1. Code
2. Usage

Further Reading

• “Communication Between jQuery UI Widgets,” Benjamin Sternthal