Five jQuery plugins that are a joy to use

Brian Dillard, Tuesday, July 22, 2008 @ 3:15 pm

Yesterday I discussed how to separate the jQuery plugin wheat from the chaff. Today, I offer a completely subjective and biased list of jQuery plugins to know and love.

1. Form

   This powerful library collects several useful utilities for manipulating forms - with or without Ajax. It adds eight separate methods to the jQuery namespace, but in some ways I prefer that to one overloaded method with complex invocation logic. The ajaxForm and ajaxSubmit methods offer, respectively, complex or simple asynchronous form manipulation. Both implicitly support progressive enhancement. Additional methods allow you to serialize forms or individual form fields, clear or reset forms and retrieve form values. These methods offer a more convenient interface and a higher level of abstraction than built-in jQuery methods.

2. Cycle

   It sometimes seems like half the jQuery plugins out there offer some mix-and-match combination of tabs, lightboxes and image slideshows. The cycle plugin does, too, but it's lightweight and well-factored. The core library is only 6k compressed. If you want fancy transitions, you can get those for another 6k. Easing and meta-data can be layered on, too. The API, too, is modular. The options bundle for the library's single, overloaded cycle method is a bit of a mishmash, but it lets you create endless slideshows, start-and-stop ones and everything in-between.

3. Live Query

   Live Query does one thing, and it does it well: It automatically binds and unbinds event handlers whether the associated content was in the native page, added via DHTML or loaded via Ajax. By offering a simple, intuitive wrapper to jQuery's own bind and unbind methods, Live Query rewires a core part of jQuery without jumbling the API or losing the feel of jQuery's syntax.

4. Templates

   A fork of Ext.js templates, this powerful plugin lets you build client-side templates that are as easy to work with as server-side ones. The default syntax leverages JSP-style variables, but you can rewire it with RegExes of your own. Either way, Templates lets you build on-the-fly DOM structures without concatenating strings by hand or building silly helper methods for tag construction. Build a template, throw a hash of data at it, and boom - instant DHTML.

5. TableSorter

   True Ajax data grids require careful handshaking between client- and server-side code. That makes pure JavaScript approaches to the problem a challenge. Oftentimes, though, you just want to add some progressively enhanced magic to client-side tables. Enter TableSorter, which adds simple or complex sorting to your tables without a lot of fuss. Several plugins offer solutions to this problem, but I haven't yet found one that does it as cleanly or elegantly as TableSorter.

agile ajax

Comments: 2 so far

• Leave a comment
• Comment feed for this post
• TrackBack URL

1. 

   Thanks! Live Query is just what I need right now for a project.

   Comment by Jack, Wednesday, July 23, 2008 @ 11:51 am

2. 

   My alternative to “jQuery live query” is “jQuery live bind”:
   http://plugins.jquery.com/project/live_bind

   And my alternative to “jQuery Templates” is “jQuery live bind”:
   http://plugins.jquery.com/project/micro_template

   Comment by diyism, Tuesday, October 28, 2008 @ 3:33 am

Leave a comment