Sortable Tables and PDAs

For the Houston Palm Users Group meeting today I wanted to put together a comparison of currently available PalmOS PDAs for people shopping for the holidays. The idea from the beginning was to present the information as accessibly as possible, and after toying with doing a slide-based presentation, but talking about them all, or some sort of giant table I settled on the table, mostly because members could check it on the website when they got home and use it as a reference. Of course, giant tables are generally as unfriendly as you can get online, so I started thinking about ways I could boil down the information into just a few values, objective and subjective, and how to present in an effective manner.

The architecture of the table ended up being simpler than I anticipated with just 7 columns: model name, street price, weight, internal memory, total pixels, screen dimensions, and the completely subjective MattRating. I chose the values based on what people seem to care about most at meetings, and with a number of assumptions. Internal memory is important, but less so now that nearly every unit supports external memory (memory stick or SD) transparently. Total pixels was a compromise to present the screen dimensions as a sortable value. “MattRating” is a subjective rating of how I think each unit rates as a gift, taking into account all its features, expandability, the unit in comparison with what else is available, and price. It’s the secret sauce that balances out the values included with everything else about a PDA that couldn’t be usefully quantified or there wasn’t space for.

Finally to make the table as useful as possible I was determined to make it sortable by the table headers. I search high and low and found nothing better than the unobtrusive DOM sortable table code from It functions exactly how I think great javascript (ECMAscript, whatever) should. My only problem has been it seems to sort things oddly when you first click on a header, but corrects itself if you click on that header again. I’m trying to track down what could be causing this, but haven’t had any luck so far. Still, even with that one flaw, it’s better by far than the other sortable table implementations I found.

The result of these labors can be seen on the HPUG website, Holiday PDA Comparison.

Now what would be cool is a way to do it with alternating row background colors

5 replies on “Sortable Tables and PDAs”

Nice work Matt!

I just can’t believe there is such a thing as a Palm users group. I am certain you just made that up to showcase your coding skills. πŸ™‚

I’m still waiting for viable PDA/phone combos. Conceptually, they are the only way to go I think.

Hi Stuart,

I tried this example on a table that originally had alternating row colors. After the sort the table somewhat lost its snazzy appeal as the alternaing colors are now all messed up. I’m sure you’ve had this question before, but I didn’t find any updates to your original code so I thought asking might be worth a shot. The approach to making a dynamic site with very little modification to the original code is something I found quite refreshing as web development is far from my primary function and I’m quite poor at it as well. Back to the question at hand… Is there an unobtrusive way to alternate the row colors after running sorrtable?