Archives for: December 2008
Tutorial for totaling table columns using jQuery
by Jack K
Here's a tutorial that shows one way to calculate totals for a set of columns in an HTML table:
http://beckelman.net/post/2008/11/13/Totals-and-Averages-of-Column-Data-on-Client-Side-Using-JavaScript-and-jQuery-Demo.aspx
This is the kind of thing that often shows up as a requirement in reporting tables and gives you a little jquery sample code for getting them in place.
jQuery Object Cache plugin
by Jack K
The jQuery Object Cache plugin showed up on my radar a few days ago. It's a neat little plugin that would come in handy if you've got some jQuery selectors that you find you're re-using often on a page and would like to toss them into a cache instead of refetching them each time you need them:
http://www.decodeuri.com/2008/11/20/new-jquery-plugin-object-cache
I could see using this on smaller projects, but more than likely we'd end up using it on larger projects where a page has a lot of dynamic activity going on in the browser. Usually we just set a local var using something like:
var $listItems = $('#list li');
and then we reuse the $listItems var, but Object Cache would allow us to stuff the results of the selector into a cache, so we wouldn't have to grab them from the DOM again.
jQuery lightBox plugin - graceful lightbox
by Jack K
Posting about Thickbox reminded me of this lightbox jQuery plugin, which has become my current fav for putting together quick galleries (like for flickr feeds and such). I'm also a sucker for the nice design at the site. And, as an extra bonus, picking through the source of this page is how I originally found the idTabs plugin (way back when this plugin was originally released), which has become one of my most frequently used plugins.
Anway, back to the point, here's the jQuery lightbox plugin:
http://leandrovieira.com/projects/jquery/lightbox/
I've found it to be nicely reliable across browsers, and it "feels" lightweight, requiring minimal mucking around the in the CSS to get it working and to style it (though I've gotta say I haven't had much need to actually mod it's styling). FYI, we almost always use a CSS reset file (usually the YUI one, but sometimes just a plain old * reset for setting padding and margins to 0) and this has played very nicely with that.
Tip for opening jQuery thickbox programmatically
by Jack K
jQuery Thickbox has been around for a while and we've used it in a bunch of projects and every time I decide I want to open a thickbox programmatically, instead of via the usual binding method, I have to fish for how to do it. The last time I went fishing, I found this and decided to post about it, thinking, "hey, if I post about it, I might actually remember where to find it next time I go fishing". OK, yeah, I'll probably still have to google for it, but anyway, here's the link:
http://blog.gridworlds.com/js/working-with-thickbox
Look down the page for "Calling Thickbox via JavaScript". Bingo.
jqModal, jQuery modal popups plugin
by Jack K
The jqModal is an "oldie but goodie" plugin. It's been around for a while and revved a few times and has been pretty reliable for what we've used it for.
http://dev.iceburg.net/jquery/jqModal/
I've gotta admit, initially getting it working was a bit frustrating for me at first. At the time (a while back) I had just started exploring jQuery modal plugins and wasn't really sure which would do the job. I sunk some time into this and after some initial stumbling, gave up. Then I messed with some others and was like, "fark, that sucked" (especially with cross-browser checks), and came back to this one.
Glad I did. Once I figured out how to get it set up (the css matters a lot, take a good look at the examples), it did the job and I've used it in a bunch of projects since then, which also gave me some opportunities to try more of it's features. All panned out well.
This is a nice one to use when something like jQuery Thickbox feels like overkill and you're really looking mainly to show dialogs and messages. We've had some other cases where we needed to show external sites in the modal and for those cases opted for Thickbox or the jQuery UI dialog widget, though there's a 3rd party example of opening an external site at the bottom of the jqModal examples (I haven't tried it).
12/09/08 11:27:43 am, 