I've added a feature to HTML to enable users (and authors) to sort tables.
The basic design of the feature is that if a column's has a sorted=""
attribute, the UA will sort the table every time the mutation observers
would fire (before they fire). A table can have a sortable="" attribute,
which lets the user tell the user agent to add sorted="" attributes to
columns to sort them.
On Tue, 6 Nov 2012, Ojan Vafai wrote:
> On Tue, Nov 6, 2012 at 11:25 AM, Ian Hickson wrote:
> > On Thu, 1 Jul 2010, Christoph P�per wrote:
> > >
> > > 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.
Done.
> > > Nevertheless the design should make it possible to add the other
> > > direction later.
Well I guess nothing would stop us supporting sorted="" on s at the
front of a row, but boy, that would be a lot more complicated to do. You'd
have to be moving cells around all over the place.
> > > 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.
Any column with a is sortable, for now. We can add a "nosort" column
or something later if this becomes a problem.
> > > 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.
Ascending/descending is supported (sorted="reversed").
Any temporal syntax supported by can be used by putting as
the only child of the cells to sort.
I intend to spec some sort of algorithm for doing numeric/string
comparison, but haven't yet come up with a good solution. If you have any
suggestions, this is the bug tracking this issue:
https://www.w3.org/Bugs/Public/show_bug.cgi?id=20524
> > > Several columns may be used for sorting by some kind of priority.
You can set sorted="" on multiple columns' headers, and give a sort key
cardinality in each, as in sorted="1", sorted="2", etc.
> > > The original order must be restorable.
This I have not supported. I don't see how to support it sanely.
> > > 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.
I've used for this, alongside .
> > > There may be columns that shall remain stable, eg. rank numbers.
I haven't supported this. I've no idea how to do this sanely, especially
given cells with column and row spans.
> 1. Would sorting actually reorder the DOM nodes or just change their
> visual order? It's not clear to me which one is better. I think the
> former is what you'd want most of the time.
I've gone with reordering the DOM nodes. Things like :nth-child styling
become nigh on impossible without doing it at the DOM level, not to
mention the confusion that would reign from having such a dramatic
disconnect between rendering and DOM (e.g. with abs pos, etc).
> 2. What values should the sort property allow. One idea is that it takes
> a JS function similar to what JavaScript's sort function takes. If you
> leave it out then it just does alphanumeric sort.
I was going to have a comparator function, but I couldn't see a sane way
to make it work in the face of hostile functions that mutate the DOM, so
I dropped it. You can do custom sort orders by giving a key in the
element's value="" attribute, though.
> 3. What elements does it go on? I don't see what it would do on a td. I
> could see putting it on a th though. Also, it's not clear to me what
> would get sorted. For example, in some tables, you would group trs
> inside tbodys and want to sort those.
sorted="" goes on a column-heading , ideally in a but you can
also put it on the first row of your if you don't have a .
Rows are sorted on a per-group basis. Rows that span each other are
treated as one row for sorting.
On Tue, 6 Nov 2012, Boris Zbarsky wrote:
>
> Another obvious question: how does (or should) sorting interact with
> rowspans?
The sort algorithm groups rows that span each other together and treats
them as one (using the data in their top row for sorting).
On Wed, 7 Nov 2012, Silvia Pfeiffer wrote:
>
> http://tympanus.net/codrops/2009/10/03/33-javascript-solutions-for-sorting-tables/
Interesting, thanks.
> Also, a sortable table's header needed some