I’m currently in full-on development mode on two projects, a Mac application and a website, and while I’ve been toiling I’ve found some terrific open-source code that has saved me weeks of programming time. So this column is a bit of a goody-bag of assorted open-source utilities that I’ve been using in earnest.
The web project I’m working on requires me to display a large amount of data in a tabular format. The client wants to be able to sort the data, filter it and search for specific items, so basically what’s required is the world’s most flexible HTML table.
There are a number of possible approaches I could have taken to supply such a beast, but the best for my purposes turned out to be a quite tremendous application from jQuery.
jQuery Grid Plugin
Regular readers will know that I’m a big fan of the jQuery JavaScript framework, which simplifies creating JavaScript-heavy web applications no end – and let’s face it, all web applications these days are JavaScript-heavy.
It has an extensible architecture, which means that while the framework itself is relatively compact, other people can produce plugins to add new features to it, and that’s exactly what the Grid Plugin is. This add-on extends jQuery to provide the most flexible and feature-rich grid or table I’ve ever seen.
This grid can be populated directly from a JavaScript array or, more usually, via an Ajax request to the server. The server’s response can come in the form of a JSON or XML document, which can be created using whatever back-end language you want (the documentation shows PHP, but as long as you – or your back-end developer – can generate XML or JSON, then whatever you use is fine).
There are so many different options available that all I can do here is give you a taste, so check out the documentation for a fuller description.
jQuery Grid Plugin add-on extends jQuery to provide the most flexible and feature-rich grid or table I’ve ever seen
Here’s just a sample of what you can do with a jQuery Grid: click on a column heading to sort out that column, in ascending or descending order; drag columns around to rearrange them; edit cell contents (either inline or via a modal dialog box); search in any column; automatically format data as, say, date or currency; page through large datasets; automatically load more data as the user scrolls further down the list; and drag and drop rows from one grid into another. The list goes on and on.
My only real complaint is that the documentation isn’t quite up to the quality of the software, but there are plenty of demos so if the docs don’t tell you exactly what you’re looking for, you can just browse the source code of the demo pages.
One other small niggle is that the demo pages are ordered according to when features were added to each major release of the software, so you’ll find demos of how to add editing to cells cropping up in several different places, for instance, as the feature set widened over subsequent releases.
That means you’ll probably want to spend half an hour or so going through every single demo to see what features are available before you start programming with the Grid Plugin.
Once you’ve started, though, you’ll be extremely happy at just how simple it is to get things done. The client I’m working with on this particular project thinks I’m a superstar for implementing so many features so quickly, when really all I’m doing is standing on the shoulders of giants.
Disclaimer: Some pages on this site may include an affiliate link. This does not effect our editorial in any way.
