How to Make Sortable Tables in Textile
One of my favorite organizational tools is Instiki. I use it for note-taking, maintaining reference information, and keeping lists. I have several lists that I keep in tables, and the other day I had need to make them sortable. Here’s how I did it.
The first thing you need is Stuart Langridge’s
sorttable Javascript
library. This is a library that allows you to make any table sortable,
just by giving it a class of “sortable”, and a unique ID. It’s smart
enough to figure out how to sort most kinds of data, so it will sort a
date column as a date, and a number column as a number. Very cool piece
of code. Anyway, take this Javascript file and put it in the the
public/javascripts
directory for your Instiki installation.
Next, start editing the page with the table that you want to make sortable. At the top add the following declaration:
Next we’ll modify the table. Usually tables in Textile look something like this:
|ID|Name| |1|Joe Smith| |2|Susie Jones| |3|Bob Barker|
We need to add a table declaration and associated modifier in order to give it a CSS class of sortable, and a unique ID:
table(sortable#mytable) |ID|Name| |1|Joe Smith| |2|Susie Jones| |3|Bob Barker|
The class name has to be “sortable”, but the ID (the part after the #) can be anything you want as long as it’s unique.
Save your changes, and you should now be able to sort by any column in your table.