[pmwiki-users] Sortable tables

[Hans]

I added a recipe script for this, integrating the javascript and
adding some markup which lets users change styles etc.

See http://www.pmwiki.org/wiki/Cookbook/SortableTables

Load javascript for a table in a page with markup (:sortable:). you
can add a number of parameters to this markup in order to change the
styling, background row colors, heading row font color, sort arrow
color, date type etc.

Create a table using simple table markup. Add class=sortable and an
id like id=sometable to the first table markup line.
Example:

(:sortable:)
||class=sortable id=thetable
||!First Column ||!Second ||!Third||!Fourth ||%colnosort%'''Fifth'''
||
||2     ||y     ||20050307      ||              ||Row  ||
||4     ||w     ||20050406      ||€4.20         ||Unsortable ||
||%rownosort%1  ||Z     ||06-02-2004    ||€5.00         ||This
||3     ||X     ||aug 17 2006   ||€6.50         ||Is
||%rownosort%5  ||V     ||05/03/2004    ||€7.15         ||See?

%colnosort%
    Adding %colnosort% to the heading cell will make the heading
non-clickable and non-sortable, but do not use ! to make this cell
into a heading cell (<hd> HTML tag)! 
%rownosort%
    Adding %rownosort% to a bottom row cell will make the bottom row
non-sortable, i.e. it will remain bottom row. Useful to display totals
etc. 

Optional parameters for (:sortable:) markup:

* date=us - non-european date type for sorting by date.
  Default is 'eu'
* oddrowbg=colourcode - background color for odd rows.
  Default is  '#f3f3f3'.
* evenrowbg=colourcode - background color for even rows.
  Default is '#e8e8e8'.
* headerrowbg=colourcode - background color for header row.
  Default is '#bbb'.
* bottomrowbg=colourcode - background color for bottom row
  (marked with style %rownosort%). Default is '#d6d6d6'.
* arrows=black or arrows=gray - alternative arrow colors.
  Default is white.
* headerrow=colourcode - header row font color. Default is white.
* altrowbg=0 - do not show alternative row background colors.
  Default is 1.

Example: (:sortable headerrow=#000  headerrowbg=#efe arrows=black :)

Note: Markup(:sortable:) will load the javascript and the styles
(so these will only be loaded for the wiki page which needs them).
These will be applied to all tables in the page content which have
class=sortable. You cannot put this into a SideBar or other subpage,
it needs to be in the main page content.

Enjoy!

  ~Hans