views:

516

answers:

4

How can I make a table sortable using javascript without loading data via AJAX? More specifically, I'm looking for a solution that gives me the following:

  • Works on a plain old HTML table
  • Makes columns sortable using a natural comparison
  • Is agnostic of server-side technology (should be portable regardless of whether the tables are being rendered by JSP, PHP, etc)
  • Implemented preferably as an extension to JQuery, which I'm already using in the specific project I'd like to immediately apply this to. I'm open to suggestions involving another javascript framework such as YUI, but it will need to play nice with JQuery.

What I'm not looking for:

  • A solution which requires me to populate the data via an AJAX call. I'd like to apply this in a project that has a number of plain old HTML tables for things like search results that I'd like to quickly make sortable without rewriting any server-side code.
  • Paging.
  • Filtering.
  • The ability to specify arbitrary comparison logic.

I'm purposefully omitting our technology stack for the specific project I'm working on for now, but will include it if people feel that it is absolutely necessary. Again, I'm most interested in solutions that don't involve anything on the server. There are a ton of projects written in all sorts of languages that could use a little love in this area.

Regarding the issue of similar, existing questions on Stack Overflow

I've done some poking around, and the closest question I can find to mine is this one. My requirements are a little different, however, and so I decided to ask a new question.

+1  A: 

Try sortable.js.

RedFilter
A: 

Along with OrbMan's answer, you can look at wikibits.js, which is MediaWiki's version of the sorting code. It doesn't require any AJAX or special glue code, just a simple class (sortable) to designate sortable tables.

The code is freely licensed, and used in production all over the Wikimedia sites.

Matthew Flaschen
+3  A: 

The jquery plugin tablesorter works very nicely.

antony.trupe
interested to know why this was downvoted.
antony.trupe
+1  A: 

Tablesorter is a jQuery plugin which works similar to sortable.js, turning a normal HTML table into a sortable one.

Marquis Wang
beat you by a few seconds :P
antony.trupe
Curse you Antony Trupe!
Marquis Wang