This modified version of sorttable supports (almost) everything the original from kryogenix did, but also improves browser compatibility and adds new features to it. Note the CSS used for these examples is of course free to use
Use "data-st-key" to provide a custom key (timestamp in this case)
But you could "simply" extend sorttable instead, and train it to sort your format
duration
23 d 12 h 36 m
12 d 05 h 00 m
7 d 22 h 44 m
7 d 17 h 56 m
6 d 21 h 40 m
2 d 23 h 48 m
1 d 14 h 00 m
0 d 15 h 40 m
115 d 08 h 56 m
duration
23 d 12 h 36 m
12 d 05 h 00 m
7 d 22 h 44 m
7 d 17 h 56 m
6 d 21 h 40 m
2 d 23 h 48 m
1 d 14 h 00 m
0 d 15 h 40 m
115 d 08 h 56 m
duration
23 d 12 h 36 m
12 d 05 h 00 m
7 d 22 h 44 m
7 d 17 h 56 m
6 d 21 h 40 m
2 d 23 h 48 m
1 d 14 h 00 m
0 d 15 h 40 m
115 d 08 h 56 m
ugh, wait! what if I want a column to have a row counter? CSS counters ;) Unless you've got a real good reason why sorttable should do it
and if I want every other row to have a different background? CSS background with :nth-child selector is perfectly fine for alternating row colors
#
alpha
numeric
#
F
74
C
12
A
23
E
36
D
52
B
34
alpha
numeric
F
74
C
12
A
23
E
36
D
52
B
34
Table with multiple bodies and headers
further demonstration with a "paged" table
number
square root
0
0
7
2.6457513110645905905016157536393
5
2.2360679774997896964091736687313
2
1.4142135623730950488016887242097
1
1
number
square root
4
2
3
1.7320508075688772935274463415059
6
2.4494897427831780981972840747059
8
2.8284271247461900976033774484194
9
3
number
square root
number
square root
FAQ (click on one to view anser)
I'm really in a hurry, how to use sorttable with "non-weird" tables?It's as simple as downloading and adding the script: <script src="sorttable.js"></script>
My table is quite dynamic and content will be added and removed a lot. I've noticed bad performance when the user tries to sort the table. How can I improve that?Just enforce a sort method for each column (numeric,alpha,ddmm,mmdd) by adding a class to their <th> like `sorttable_numeric` Sorttable redetects the sort method each time the user wants to sort a column and the table got changed since last sort.
My table is created by Javascript, how to enable sorting on that one?Call `sorttable.makeSortable(TABLE)`
Arrows, how to change them?Use CSS or replace the `sorttable.ARROWS` javascript array. HTML is allowed
Can I set a column to be unsortable?See the "CSS counters" example for more about it, but basically simply add the class `sorttable_nosort` to every column you don't want to be sortable
What sorting types / algorithms currently exist?these:
`sorttable_numeric` - numbers or currency with decimal point (3.1415926535)
`sorttable_numeric_comma` - numbers or currency with decimal comma (3,1415926535)
`sorttable_alpha` - strings or names using very simple sort (we don't have natural sorting yet)
`sorttable_ddmm` - dates in format dd/mm/yyyy
`sorttable_mmdd` - dates in format mm/dd/yyyy
You can use sorttable to make almost any page's tables sortable, simply bookmark the link 'activate sorttable' and open it on the page you want to make sortable or create a Greasemonkey userscript from it.
...
This
table
got
no
body
This
table
is
empty
float
0
2.6457513110645905905016157536393
2.2360679774997896964091736687313
1.4142135623730950488016887242097
1
These buttons are mostly for testing purposes or comparison to original sorttable