GeekFindr: Table Sorting
So, at heart, I’m a backend programmer - when someone tells me they want to have tables sortable by different columns that’s a backend issue. One benefit of that is that it’s easily made bookmarkable so if reports are customizable in any way, it’s easy to bookmark a single configuration. But, if that’s not really much of a concern and the sorting mechanism is obvious (as it generally always is) using a javascript solution can be an easier and more elegant solution.
So, I’d begun writing such a beast when it occurred to me that someone else may have already written such a thing - and lo, google delivered unto me sorttable. This follows the maxim of unobtrusive javascript which is probably one of my favourite maxims for the language - it really makes javascript add ons clean and wonderful.
It works as most unobtrusive javascripts do with the application of particular classes to particular elements. Simply by adding a “sortable” class to your table it does a pretty good job of figuring everything out and making all your header elements clickable and making all columns sortable. It also does a great job of figuring out exactly how columns should be sorted. Fortunately for those cases where it picks wrong or you have some other criteria you can tell it how columns should be sorted or if they are sortable at all. If you’ve got a total row at the bottom, you can set that to not sort - so that as columns are sorted the total simply stays wired to the bottom.
Overall, this is a well written piece of code and particularly easy to use. I haven’t yet used this in production, but I plan on it. The only modification I made to it was centralizing the code that sets the up and down arrow that indicates which column is currently the sort column and which way it’s sorting (ascending or descending). I suspect I’ll eventually modify that code in general to set a particular style and the such so that it’s a little more configurable. But they’re pretty trivial changes.
If you have table sorting needs, definitely give sorttable a look see.
