Skip to content

“Complete” Widget Factory Pattern

Jump to bottom Edit New page
Iurii Kucherov edited this page Aug 5, 2015 · 14 revisions

“Complete” Widget Factory Pattern

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

While the jQuery plugin authoring guide is a great introduction to plugin development, it doesn't help obscure away common plugin plumbing tasks that we have to deal with on a regular basis.

The jQuery UI Widget Factory is a solution to this problem that helps us build complex, stateful plugins based on object-oriented principles. It also eases communication with our plugins instance, obfuscating a number of the repetitive tasks that we would have to code when working with basic plugins.

Stateful plugins help us keep track of their current state, also allowing us to change properties of the plugin after it has been initialized.

One of the great things about the Widget Factory is that the majority of the jQuery UI library actually uses it as a base for its components. This means that if we’re looking for further guidance on structure beyond this pattern, we won’t have to look beyond the jQuery UI repository on GitHub.

This jQuery UI Widget Factory pattern covers almost all of the supported default factory methods, including triggering events. As per the last pattern, comments are included for all of the methods used and further guidance is given in the inline comments.

  1. Code
  2. Usage

Further Reading

Add a custom footer
Add a custom sidebar
Clone this wiki locally