[whatwg] Sortable Tables

[Christoph Päper]

It’s a common task outside HTML to sort tables by one or more of its columns. 

There does seem interest among web content providers in making tables client-side sortable since there are several Javascript solutions to do just that, eg. <http://meta.wikimedia.org/wiki/Help:Sorting>, <http://tablesorter.com/docs/>. From these we can learn what would be needed from markup to help sorting algorithms. None of this must be behaviorial, but descriptionary.

I have not found much on sortable tables on whatwg.org, especially when excluding ‘datagrid’.

For starters, only rows inside ‘tbody’s shall be reordered. For now columns don’t have to be reordered, ie. only vertical, no horizontal sorting. Nevertheless the design should make it possible to add the other direction later.

Not every table has content that makes sense to be sorted in a different order. So sortable tables should be marked as such. Note that ‘col’ and ‘colgroup’ elements are hardly supported.

Not every column has content that makes sense to be sorted in a different order. So non-sortable columns inside sortable tables should be marked as such.

There are different ways to sort, eg. numeric, temporal or alphabetic and ascending or descending. Therefore columns should bear information how they should be sorted, ie. what kind of content their cells have. 

Several columns may be used for sorting by some kind of priority.

The original order must be restorable.

Cell content may not consist of the string that should be used verbatim for sorting purposes, eg. leading articles or similar numbers with different units (‘g’, ‘kg’, ‘t’ …). Cells should have an optional attribute indicating their sort key. The ‘time’ element already provides the necessary metadata features for temporal sorting – maybe there should be more of such elements instead.

There may be columns that shall remain stable, eg. rank numbers.

Spanning cells, ie. ‘colspan’ and ‘rowspan’, are a problem or rather two quite different problems. This can be solved if browsers would expand those spans prior to sorting and possibly reapply them afterwards.

Solution 1

A ‘sort’ attribute is introduced for ‘table’, ‘col’, ‘td’ elements at least, but with different meaning and values.

  table @sort: columns | column-groups | rows | row-groups | none
  col   @sort: [numeric | alphabetic | datetime | rank | …] 
               [ascending | descending] | none
  td    @sort: <string>

Solution 2

Since the ‘sort’ attribute of solution 1 seems more behavioral than semantic, its name could be different for each element. The possible values may then differ too. For instance:

  table @sortable: (binary)
  col   @content:  numeric | alphabetic | datetime | … | various
  td    @sortkey:  <string>

PS: I’m not sure whether HTML should have a way to indicate which rows and columns are less important and therefore could be collapsed (“visibility: collapse”) to fit the table into the viewable area.