Help:Sorting
Template:H:h
Tables can be made Template:Mlw via client-side JavaScript with class="sortable" (in combination with the usual formatting: class="wikitable sortable"). This works in MediaWiki 1.9 and above, which is installed in all Wikimedia projects.
A sortable table is identified by the arrows in each of its header cells. Clicking them will cause the table rows to sort based on the selected column, in ascending order first, and subsequently toggling between ascending and descending order. Links and other wiki-markup are not possible in headers.
Note that all of the below is subject to change due to improvements in the script.
JavaScript
The JavaScript code wikibits.js has on each site a copy at {{SERVER}}/skins-1.5/common/wikibits.js, on this site //www.tfcmud.com/skins-1.5/common/wikibits.js. In addition a site may have a page MediaWiki:Common.js which adds and overrides some code.
Sort modes
The way items are sorted depends on the data type of the item currently in the first row. To determine the data type, the following tests are made in order, until one matches. Thus, if "24-12-2007" is the first item, then all items will be compared as dates.
To force an item to match as text, use the "sms" template, e.g. {{sms|101 Dalmatians}}
Unfortunately, there's no way to force an item to sort as numeric or date without using custom sort keys (generally by using formatting templates): if the item on the first row to sort does not match a supported format, it will be treated as text, and all the column will be sorted as text, possibly changing the content of the item on the first row so that it will apparently be of a distinct type.
- Proposal: we could allow every cells of the table heading row to specify the expected sort mode for all cells on their column. This could be done easily by adding a class attribute on this heading cell, such as class="sort-as-text", class="sort-as-number", or class="sort-as-date", so that the Javascript code would no longer need to guess the data type of the cell content in the first sortable row. This would also remove the need to use custom key formatting in every data cell to make sure that it will sort as expected.
Tags such as span or sup are ignored when determining data type.
- Date (see also below)
- Criterion: the first non-blank element is of the form "dd-dd-dddd", "dd-dd-dd", or "dd aaa dddd"
- Order: if wgContentLanguage != "en" then string "abcdefghij" of length 10 is positioned as "ghijdeab", the string "abcdefghijk" of length 8 as "19ghdeab" if "gh">="50" (string comparison) and "20ghdeab" otherwise (i.e., the assumed format is "DD-MM-YYYY" or "DD-MM-YY"), and the string "dd aaa dddd" with "aaa" an abbreviated month name: chronologically.
- Proposed internationalisation: month names (or abbreviations) are recognized only in their English form, using only the 3 first letters. There's no way to specify another language/locale which would use incompatible abbreviations, some of them being ambiguous if only 3 characters are considered, such as juin (June) vs. juillet (July) in French, where only some months will be recognized correctly. Also dates in ISO format "YYYY-MM-DD" are not recognized correctly. For other languages than English, custom hidden sort keys still need to be specified in every cell containing such date formats.
- "Currency" (this mode can be useful for other data also)
- Criterion: the first non-blank element starts with $, £, €, or ¥
- Order: numeric, ignoring these symbols and all ordinary letters and commas, but not spaces; note that scientific notation cannot be used, as e and E are removed
- Numeric
- Criterion: the first non-blank element consists of just digits, points, commas, spaces, "+", "-", possibly followed by "e" or "E" and a string consisting of "+", "-", digits
- Order: after removing the commas and spaces, if any, if the string starts with a number the order is numeric according to the first number in the string (parseFloat is applied); it is positioned as zero if it is empty; in other cases (parseFloat returns NaN), the element is positioned like -∞.
- Proposed internationalisation: in German etc., treat comma as a decimal point
- Text (default)
- Criterion: all other cases; to avoid one of the other modes, start e.g. with a hidden "&"; this can be done conveniently with Template:Tim, which also allows more hidden text, as sortkey; while the similar templates above are called at the end of a table element, call this one at the start
- Order: after conversion of capitals to lowercase the order is ASCII – actually the order is binary, based on UTF-16 code unit values, because this is the way strings compare natively in Javascript. But some browser may use their own locale-specific ordering when comparing strings, depending on user's locale preference. There is for now no way to specify a locale explicitly that Javascript can use.
- Partial list showing the order:
!"#$%&'()*+,-./09:;<=>?@[\]^_'az{|}~é— - (see also below; a blank space comes before every other character; an nbsp code may count as a space in some browsers; two adjacent ordinary blank spaces count as one; for multiple blank spaces one can use nbsps or alternate nbsps and ordinary blank spaces)
After sorting, the data type may change, since there is a new item in the first row. This can lead to a cycle of four or even more instead of two. As this is confusing, try and avoid this situation by making sure that every element matches the criterion for the required data type. Using a Template:Ml helps.
An alternative method of making sure the sort mode of each column is as desired, is creating a first row that determines the sort modes, but in such a way that this row is not displayed and is excluded from sorting, see below.
Examples
Text after a number (e.g. a footnote) does not affect the sorting order, if the sorting mode is numeric. However, if the number at the top has text after it, this makes the sorting mode alphabetic.
|
|
|
|
|
|
|
|
|
The example with "a" gives alphabetic sorting; that with "e" ditto, the data are not mistaken for numbers in scientific format.
|
|
|
|
The first example demonstrates that text is positioned at zero, and that e.g. e3 for 1000 is not allowed; use 1e3 instead. It also shows that "-" should be used, not "−".
The second example shows that expressions are not sorted according to their evaluated value, but according to the first number.
The third example shows that a percentage is accepted for numeric sorting mode, but ignored in the actual sorting, so if a column contains percentages, all numbers have to be written as a percentage.
The fourth example shows again that "ca. 12" sorts at 0, as opposed to 12 with some text after it, which sorts at 12. In case such an element arrives at the top of a column, it causes alphabetic sorting mode.
Additional features
Excluding the last row from sorting
Sometimes it is helpful to exclude the last row of a table from the sorting process.
This can be achieved using class="sortbottom" on the desired table row (line starting with |-).
Wiki markup
{|class="wikitable sortable"
!Name!!Surname!!Height
|-
|John||Smith||1.85
|-
|Ron||Ray||1.89
|-
|Mario||Bianchi||1.72
|-class="sortbottom"
|||Average:||1.82
|}
What it looks like in your browser
| Name | Surname | Height |
|---|---|---|
| John | Smith | 1.85 |
| Ron | Ray | 1.89 |
| Mario | Bianchi | 1.72 |
| Average: | 1.82 |
More generally, one or more lines at the bottom marked with class="sortbottom" are sorted among themselves, but stay at the bottom. Thus it is not possible to keep multiple lines fixed at the bottom:
| Name | Surname | Height |
|---|---|---|
| John | Smith | 1.85 |
| Ron | Ray | 1.89 |
| Average: | 1.82 | |
| Name | Surname | Height |
Excluding the first row from sorting
As follows from what was mentioned above, the first row of a table can be made non-sortable (the code class="sorttop"class="sortbottom". This first row can either be a normal visible row (to provide annotation for the headers) or a hidden row (with each element marked with <span style="display:none">...</span>) to ensure that each column has the desired sort mode.
Making a column unsortable
If you want a specific column not to be sortable, specify class="unsortable" in the attributes of its header cell.
Wiki markup
{|class="wikitable sortable"
!Numbers!!Alphabet!!Dates!!Currency!!class="unsortable"|Unsortable
|-
|1||Z||02-02-2004||5.00||This
|-
|2||y||13-apr-2005||||Column
|-
|3||X||17.aug.2006||6.50||Is
|-
|4||w||01.Jan.2005||4.20||Unsortable
|-
|5||V||05/12/2006||7.15||See?
|-class="sortbottom"
!Total: 15!!!!!!Total: 29.55!!
|-
|}
What it looks like in your browser
| Numbers | Alphabet | Dates | Currency | Unsortable |
|---|---|---|---|---|
| 1 | Z | 02-02-2004 | 5.00 | This |
| 2 | y | 13-apr-2005 | Column | |
| 3 | X | 17.aug.2006 | 6.50 | Is |
| 4 | w | 01.Jan.2005 | 4.20 | Unsortable |
| 5 | V | 05/12/2006 | 7.15 | See? |
| Total: 15 | Total: 29.55 | Original example |
Striping
The JavaScript that makes tables sortable can add .odd and .even classes to the rows of the resulting table.
As of August 2010, this feature is disabled by default (var ts_alternate_row_colors = false; in wikibits.js) and can be enabled with the line ts_alternate_row_colors = true; in the local Common.js.
If a cascading style sheet specifies that text be displayed differently in these two classes, alternating rows in the resulting table will appear differently. For example, including the following code in a style sheet causes every sortable table to have silver and gold background stripes:
tr.odd {
background-color: silver;
}
tr.even {
background-color: gold;
}
It is also possible to define an id in a CSS that causes only tables with that id to be striped, for example:
#stripe tr.odd {
background-color: silver;
}
#stripe tr.even {
background-color: gold;
}
In this case, only tables with class="sortable" and id="stripe" would display with alternating row colors.
If a user sorts the table according to a different column, the stripes still alternate. I.e., the stripes are specific to the positions of the rows in the sorted table, not to the positions of the rows in the wikitext.
If necessary one can apply sorting using a sortkey which due to CSS is not displayed:
- <span style="display:none">...</span>
Example:
- p<span style="display:none">q</span>r gives pr
(However, on some projects, notably Ontoworld, a page with this wikitext cannot be saved, as spam protection.)
Javascript sorting is based on the text inside and outside the tags, without the tags themselves. A hidden sortkey can be put at the start. Both in the case of alphabetic and that of numeric sorting the first parts determine the order. Both parts together are used to determine the sort mode, so for numeric sorting the whole should be a valid number.
The sortkey comes at the start and is separated from the displayed text in such a way that the latter does not affect the sorting order. For example, if a sortkey system is used where there are no blank spaces in any sortkey, then a blank space can be used for separation. If a single blank space is possible in a sortkey, two nbsps can be used. For table elements for which the text to be displayed is equal to the sortkey, no duplication is needed, of course.
If the text inside and outside the tags together is of a form that would cause a sorting mode other than alphabetic (if and when the element is at the top), a character can be appended at the end of the sortkey to avoid this, again making sure it does not affect the sorting order by putting a space or two nbsps. This can be dispensed with if the element can never be at the top, but this can be complicated to assess as that can be caused by sorting other columns, with varying sorting modes, and it can change when deleting a row, adding a column, etc.
Instead of "display=none" another way is using a font color equal to the background, e.g. <font color="#f9f9f9">999</font> gives "999". With this method the hidden code can be seen in selected text (e.g. with the mouse). Also the hidden text is included when copying the rendered text. The first may be an advantage or a disadvantage, the second seems only a disadvantage. A complication is also that if a user uses a background color different from the default, the specified text color may not match it; to make sure they are the same the background color can be specified also.
Unsuitability of padding with no-break spaces
The effect of left-padding with " " codes, which render as blank spaces, depends on the browser: in IE they are (unlike actual blank spaces) counted for sorting as leading blank spaces, so in a list of numbers with text (for which the alphabetic sorting mode applies) they could be used to equalize the number of characters before the explicit or implicit decimal separator. However, in Firefox they are ignored for the purpose of sorting.
| Sorting using nbsps, works on IE but not on Firefox | Name |
|---|---|
| 100.3 FM | Third |
| 89.5 FM | First |
| 107.3 FM | Fourth |
| 95.3 FM | Second |
See also en:Talk:List of U.S. states and territories by population/Archive 1#Sortable Table.
Padding with zeros
Example:
- 000156
Formatnum can be combined with padleft:
Integer:
{{formatnum:{{padleft:299792458|16|0}}}} gives:
- 0,000,000,299,792,458
Real:
{{formatnum:{{padleft:{{#expr:((299792458.056 - .5) round 0)}}|16|0}}}}.{{padleft:{{#expr:(1000000*(299792458.056 - ((299792458.056 - .5) round 0))) round 0}}|6|0}} gives:
- 0,000,000,299,792,458.056000
Alphabetic sortkey for numeric sorting
If one needs to use alphabetic sort mode for numbers, one can construct a hidden alphabetic sortkey for this purpose. To make sure that alphabetic sort mode is used no code should satisfy the criterion for numeric sorting mode. Although this matters only for the element at the top, any element might arrive at the top due to sorting another column. Alphabetic sort mode can for example be achieved by starting all sortkeys with "&". It prevents numbers with a remark, or texts like N/A to affect sorting, and allows any choice for their sortkeys.
In the case of non-negative numbers with known upper limit (i.e., even if the table may need editing in the future the numbers are expected to remain below this limit) the sortkey can be "&" followed by the number with leading zeros. For example, in a table column with non-negative numbers below 1,000,000 the sort key of 23.4 is &000023.4
General case
- To allow a wide range numbers (between -1e100 and 1e100) the following system can for example be used:
- where scientific notation is used, it is normalized such that the absolute value of the mantissa is between 1 and 10; the exponent is put first
- scientific notation is used for all negative numbers, and all positive numbers outside some interval (below: 1e-9 to 1e9), and not inside that interval
- where the absolute value of the exponent and/or the mantissa is a decreasing function of the number, the notation uses its complement with respect to 99 for exponents and 10 for mantissas; the code "c" is added in these cases
- numbers 0 ≤ x < 1000 get a "+" in front
- positive numbers in scientific notation with a negative exponent get "+0" in front
- spaces inside the code and &-signs in front are added where needed:
- for numbers not in scientific notation the positions of all explicit and implicit decimal points are aligned
- for the starting position, i.e. the position of the first "-", "+", or "e", of other numbers, see the example table
- to avoid numeric sorting mode, below we have always either an ampersand or two letters e
- In the following the left column shows the code for alphabetic sorting, where cryptic followed by the regular notation. The second column contains the same (hence sorting the same), but with code hidden with CSS. The third column does not contain hidden parts and uses numeric sort mode. When sorting the first or second column "more than 1e9" is positioned suitably, while when sorting the third column it is positioned like 0. Moreover, if this cell would be at the top alphabetic sort mode would be used.
total of hidden and displayed text display form plain number compact sort key of other method Template:Lsc11amp Template:Lsc11amp 6 3000_6 Template:Lsc11amp Template:Lsc11amp 7 3000_7 Template:Lsc11amp Template:Lsc11amp 1,048,576 3006_1048576 Template:Lsc11amp Template:Lsc11amp 1,234 3003_1234 Template:Lsc11amp Template:Lsc11amp 123 3002_123 Template:Lsc11amp Template:Lsc11amp 16,777,216 3007_16777216 Template:Lsc11amp Template:Lsc11amp 65,536 3005_65536 Template:Lsc11amp Template:Lsc11amp 67,108,864 3007_67108864 e23 6 6e23 6e23 6e23 3023_6 e09 1.01 more than 1e9 more than 1e9 more than 1e9 3009_101 e09 1 1e9 1e9 1e9 3009_1 &&&&&&&&&+0 ec89 9.999,99 9.999,99e-10 Template:Sms 9.999,99e-10 9.999,99e-10 2990_999999 &&&&&&&&&+0.000,000,001 0.000,000,001 0.000,000,001 2991_1 &&&&&&&&&+0 ec87 6 6e-12 6e-12 6e-12 2988_6 &&&&&&&&&+0 ec86 7 7e-13 7e-13 7e-13 2987_7 &&&&&&&&&+0 ec87 5 5e-12 5e-12 5e-12 2988_5 &&&&&&&&&&-e-10 c0.000,01 -9.999,99e-10 -9.999,99e-10 -9.999,99e-10 1010_000001 &&&&&&&&&&-e-08 c6.8 -3.2e-8 -3.2e-8 -3.2e-8 1008_68 &&&&&&&&&&&-ec86 c0.3 -9.7e13 -9.7e13 -9.7e13 0987_03 &&&&&&&&&&&-ec99 c7.7 -2.3 -2.3 -2.3 1000_77 Template:Lsc11amp Template:Lsc11amp 0 2000_ Template:Lsc11amp.3 Template:Lsc11amp.3 0.3 2999_3
An advantage of this method is that for a range of positive numbers for which scientific notation is often not common, no separate sortkey is needed, just invisible &-signs and in some case a plus sign are added in front. When using a template to produce both the invisible and the visible text this advantage may not be important.
In the following method the sort code is more compact.
- A simpler algorithm may be used to generate shorter sort keys for arbitrarily large or small numbers of arbitrary precision; this algorithm can be easily implemented in templates from any computed value:
- Write numbers in normalized scientific notation (with 1 <= mantissa < 10, except when number is zero, or NaN, or infinite : see table below).
- Compute the following three groups of digits:
- 1. Write a first digit depending on the signs of the number or of the normalized exponent:
Sign of number Sign of normalized exponent Number value range First group to select negative positive -Infinite < x ≤ -10 0 negative or null -10 < x < 0 1 positive or null negative +0 ≤ x < +1 2 positive or null +1 ≤ x < +Infinite 3
- 2. Take the absolute value of the normalized exponent. Then if the sign-digit above is 0 or 2 and if the number is not null, transform the exponent by substracting this absolute value from 1000 (i.e. take the complement to 9 of all digits, then add 1 to the resulting integer). Write the transformed exponent as a group with fixed length of 3 digits (if you need larger exponents, use 10000 for 4 digits, and so on).
- 3. If the sign-digit (computed from table above) is 0 or 1 (i.e. the number is strictly negative), substract the absolute value of the normalized mantissa from 10 (take to the complement to 9 of all digits, then add 1 to the integer formed by dropping the decimal separator on the second position). Write the resulting integer as a third group of digits (you may drop that dot from the group)
- The groups of digits need to be separated in such a way that it cannot be confused as a number or a date: a good separator is the underscore, but groups may just be comma-separated as well. Only one separator is needed (because the two first groups have a fixed length), but it is suggested to use it between all three groups, or at least between the second and third group (even if this one is empty). In the table below, both kinds of separators are visible, to make things clearer.
- As this format has no limitation on the precision of the mantissa, you may append other characters (including unnecessary trailing zeroes from the mantissa) that are needed to sort related informations (such as "more than", "less than") in an additional group.
- Examples are shown in the table below which sorts correctly in the last two columns; this table shows the computed groups and the compacted sort keys when normalized exponents have been written on 3 digits ; all trailing zeroes (or mantissa digits for infinite values), as well as the decimal dot, in the expression of the mantissa have been dropped from the compact sort key:
Value Value normalized in
scientific notationComputed groups Compact sort key +Infinite + 10+ INF × 1.000 4 ; 000 ; 1.000 4000_ 9.999e999 + 10+ 999 × 9.999 3 ; 999 ; 9.999 3999_9999 1e17 + 10+ 017 × 1.000 3 ; 017 ; 1.000 3017_1 1234 + 10+ 003 × 1.234 3 ; 003 ; 1.234 3003_1234 234 + 10+ 002 × 2.340 3 ; 002 ; 2.340 3002_234 34 + 10+ 001 × 3.400 3 ; 001 ; 3.400 3001_34 10 + 10+ 001 × 1.000 3 ; 001 ; 1.000 3001_1 9.999 + 10+ 000 × 9.999 3 ; 000 ; 9.999 3000_9999 8 + 10+ 000 × 8.000 3 ; 000 ; 8.000 3000_8 2 + 10+ 000 × 2.000 3 ; 000 ; 2.000 3000_2 1 + 10+ 000 × 1.000 3 ; 000 ; 1.000 3000_1 0.9999 + 10– 001 × 9.999 2 ; 999 ; 9.999 2999_9999 0.8 + 10– 001 × 8.000 2 ; 999 ; 8.000 2999_8 0.2 + 10– 001 × 2.000 2 ; 999 ; 2.000 2999_2 0.1 + 10– 001 × 1.000 2 ; 999 ; 1.000 2999_1 0.00002 + 10– 001 × 2.000 2 ; 995 ; 2.000 2995_2 0.000002 + 10– 006 × 2.000 2 ; 994 ; 2.000 2994_2 1e-999 + 10– 999 × 1.000 2 ; 001 ; 1.000 2001_1 0 + 10+ 000 × 0.000 2 ; 000 ; 0.000 2000_ -1e-999 – 10– 999 × 1.000 1 ; 999 ; 9.000 1999_9 -0.000002 – 10– 006 × 2.000 1 ; 006 ; 8.000 1006_8 -0.00002 – 10– 005 × 2.000 1 ; 005 ; 8.000 1005_8 -0.1 – 10– 001 × 1.000 1 ; 001 ; 9.000 1001_9 -0.2 – 10– 001 × 2.000 1 ; 001 ; 8.000 1001_8 -0.8 – 10– 001 × 8.000 1 ; 001 ; 2.000 1001_2 -0.9 – 10– 001 × 9.000 1 ; 001 ; 1.000 1001_1 -0.9001 – 10– 001 × 9.001 1 ; 001 ; 0.999 1001_0999 -0.9999 – 10– 001 × 9.999 1 ; 001 ; 0.001 1001_0001 -1 – 10– 000 × 1.000 1 ; 000 ; 9.000 1000_9 -2 – 10– 000 × 2.000 1 ; 000 ; 8.000 1000_8 -8 – 10– 000 × 8.000 1 ; 000 ; 2.000 1000_2 -9 – 10– 000 × 9.000 1 ; 000 ; 1.000 1000_1 -9.001 – 10– 000 × 9.001 1 ; 000 ; 0.999 1000_0999 -9.999 – 10– 000 × 9.999 1 ; 000 ; 0.001 1000_0001 -10 – 10+ 001 × 1.000 0 ; 999 ; 9.000 0999_9 -11 – 10+ 001 × 1.100 0 ; 999 ; 8.900 0999_89 -34 – 10+ 001 × 3.400 0 ; 999 ; 6.600 0999_66 -34.02 – 10+ 001 × 3.402 0 ; 999 ; 6.598 0999_6598 -34.1 – 10+ 001 × 3.410 0 ; 999 ; 6.590 0999_6590 -234 – 10+ 002 × 2.340 0 ; 998 ; 7.660 0998_7660 -1234 – 10+ 003 × 1.234 0 ; 997 ; 8.766 0997_8766 -9.999e999 – 10+ 999 × 9.999 0 ; 001 ; 9.999 0001_0001 -Infinite – 10+ INF × 1.000 0 ; 000 ; 1.000 0000_
Dates
| |||||||||||||||||||||
|
String sort mode (edit to view source)
|
The sort mode is based on the rendered format; in the case of links: the labels, not the targets (though including any content hidden by "display:none").
Date sort mode
One of the formats allowed for the date sort mode is produced by the Mediawiki's date-formatting feature in the right combination of preference and wikitext format: we need to use in the wikitext the format [[dd mmm]] [[yyyy]] (done in the example) and either no preference or preference dmy, or use with preference dmy one of the formats [[mmm dd]][[yyyy]], [[yyyy]][[mmm dd]], or [[yyyy]][[dd mmm]].
Incomplete dates:
- <span style="display:none">00 Jan </span>2007
- <span style="display:none">00</span> Mar 2007
See also: bugzilla:8226.
String sort mode
String sort mode provides chronological sorting for dates formated as <span style="display:none">&</span>YYYY-MM-DD; the hidden "&" avoids numeric sort mode.
Also we can hide the YYYY-MM-DD and put after that any choice of displayable text, including Mediawiki date formatting. The Wikipedia template Template:Tiw provides a convenient way of applying this method while using the date-formatting feature for display.
For years BC we can use, for example, !9937-09-23 for -0062-09-23 (subtract the year number BC from 10000, or the absolute value of the astronomical year from 9999).
If a table column contains any or all incomplete dates, this will not cause sorting problems. If only a year and month are given, that incomplete date is positioned alphabetically before the first day of the month in question. Likewise, if only a year is given, the date is positioned before the first month or day given for that year.
If at some point (i.e., after possible previous sorting) the form [[YYYY]] is at the top with a non-negative year, sorting would be numerical; in this case, after toggling between ascending and descending there would be no proper sorting within each year (because parsefloat is applied, finding the first number in the string, and basing sorting on only that number). Also, years BC would not be sorted properly. Therefore, alphabetic sorting has to be enforced. This can be done by putting a non-displayed character after the year, separated by a space.
Use of #time
Using parser function #time we can put <span style="display:none">&{{#expr:3e11+{{#time:U|..}}}}</span> in front of the displayed date. This works in the range 1 Jan 111, 00:00:00 through 31 Dec 9999, 23:59:59 for the proleptic Gregorian calendar. The added value makes all values positive and the same length (if scientific format would show up an additional step is needed to prevent this). The "&" forces string sort mode.
Dates and times can be entered in any php date/time format. Note that when we have just a year, a month (typically Jan) must be added in the hidden part.
Example using Help:Sorting/date:
To use dates before the year 111, add a multiple of 400, e.g. 6000, to all years, this effectively shifts the range to 1 Jan -5889, 00:00:00 through 31 Dec 3999, 23:59:59, without changing the calendar.
See also:
Secondary sortkey
If a column contains a value multiple times then sorting the column preserves the order of the rows within each subset that has the same value in that column (Template:Mlw). Thus sorting based on a primary, secondary, tertiary, etc. sortkey can be done by sorting the least-significant sortkey first, etc.
First click on column Text and then on Numbers, you'll see that the ordering is on Numbers (1), Alphabet (2).
| Numbers | Text | Dates | Currency | More text |
|---|---|---|---|---|
| 4 | a | 01.Jan.2005 | 4.20 | row 1 |
| 5 | a | 05/12/2006 | 7.15 | row 2 |
| 1 | b | 02-02-2004 | 5.00 | row 3 |
| 1 | a | 02-02-2004 | 5.00 | row 4 |
| 2 | x | 13-apr-2005 | row 5 | |
| 2 | a | 13-apr-2005 | row 6 | |
| 3 | a | 17.aug.2006 | 6.50 | row 7 |
| 3 | z | 25.aug.2006 | 2.30 | row 8 |
| 3 | z | 28.aug.2006 | 5.50 | row 9 |
| 3 | z | 31.aug.2006 | 3.77 | row 10 |
| 3 | z | 01.sep.2006 | 1.50 | row 11 |
| Bottom |
Keeping some rows together
Partly hidden sortkeys can be used to keep certain rows together. The original mutual order of these rows is preserved.
Example where this is the case for the rows about the Netherlands:
| Country/province | Capital |
|---|---|
| France | Paris |
| Netherlands | Amsterdam |
| South Holland | The Hague |
| U.K. | London |
Limitations
Javascript sorting may not work properly on tables with cells extending over multiple rows and/or columns (however, sorting of columns up to and including the first with colspan does not seem to be affected). Also, while cells can be empty, they should not be missing at the end of a row. In these cases sometimes the table gets messed up when attempting to sort, while other times some of the sorting buttons work while others don't.
Colspan workaround
To allow sorting, the formal number of cells in each row should be equal (if not all columns are made sortable this should apply at least for the number of cells up to and including the last sortable column). However, with a CSS hack the number of cells shown in a row can differ from the formal number of cells. For example, two formal cells can be shown as one by specifying a width for the first column, shifting the contents of the second cell to the left, increasing its width by the same amount, and hiding the cell border that would normally be visible. Hidden sortkeys can be used to control, for sorting with respect to each column, how this row should be sorted.
Example:
| Country | Capital |
|---|---|
| France | Paris |
| U.K. | London |
This can be combined with the method of "keeping some rows together" demonstrated above. For an example of an application of this, consider a table of three columns where the third column would make the table too wide, such as a column of miscellaneous details. These details can be put in separate rows, each staying below the corresponding row when the table is sorted.
Example:
| Country | Capital |
|---|---|
| France | Paris |
| U.K. | London |
| Germany | Berlin |
A table row template makes this technique less cumbersome to apply, see e.g. w:List of furry conventions, w:Template:Furry-con-list-start and w:Template:Furry-con-list-entry.
Controlling sorting and display
Text undesired for sorting but needed for display:
- In numeric sorting mode, this text (e.g. footnotes) needs to be put after the number; if at the top it causes string sort mode. See e.g. Help:Sorting/countries.
- In date sorting mode, this text needs to be put in a separate column; in the case of a cell containing a range of dates or numbers (e.g. from .. to ..), text in surplus of what is required for sorting is put in the extra column. If the first part of the text is used for sorting, then the extra column needs to be the following one; conversely, if the last part of the text is used for sorting, then the extra column needs to be the previous one; depending on the table format, this dividing of an item over two cells may look ugly.
- In alphabetic sorting, any footnotes etc. do not require a separate column; they can simply be put at the end of the element.
Text undesired for display but needed for sorting:
- can be put as hidden text in the column to be sorted
Combining the two, we can have displayed text independent of text used for sorting, by fully hiding the latter, and fully putting the former in a separate column (in date sorting mode and numeric sorting mode) or in the same column after the hidden text (in alphabetic sorting). Fully putting the displayed text in a separate column may look ugly if it is not done consistently for a whole column, but only for elements that require this (e.g. if most entries in a column are single numbers, but some are ranges).
Static column
A static column, e.g. with row numbers, can be obtained with two side-by-side tables with for each row the same height set in both tables:
|
|
The style can be adjusted to make it appear as a single table. If for some row the height of that row is too small for the text in a cell on one of the sides, the browser increases it, and there is no longer a match.
Default order
It is not possible to make a table appear sorted by a certain column without the user clicking on it. By default, the rows of a table always appear in the same order as in the wikitext. If you want a table to appear sorted by a certain column, you must sort the wikitext itself in that order; see the next section for one way to do this.
Sorting the wikitext of a table
Sorting the wikitext itself, thus creating a new default sort order, can be done semi-automatically by making an auxiliary sortable table where each row is rendered as the wikitext for the corresponding row of the original table. Applying the JavaScript sorting as desired, the result can be copied to provide the sorted wikitext for the original table.
Example:
Original table:
| demo |
|---|
| 9 |
| 12 |
| 11 |
Auxiliary table:
| aux |
|---|
| |- | 9 |
| |- |12 |
| |- |11 |
After copying the rendered text to the edit box, to provide the body of the table syntax (between the header part and the closing line), this renders as a new table, sorted by default:
| demo |
|---|
| 9 |
| 11 |
| 12 |
The auxiliary table can be kept, to be reused in case one later (or on another page) wants to use another column for determining the default order, or wants to change between ascending and descending.
Alphabetic sorting order
| demo |
|---|
| ! |
| " |
| # |
| $ |
| % |
| & |
| ' |
| ( |
| ) |
| * |
| + |
| , |
| - |
| . |
| / |
| 0 |
| 9 |
| : |
| ; |
| < |
| = |
| > |
| ? |
| @ |
| [ |
| \ |
| ] |
| ^ |
| _ |
| ' |
| A |
| Z |
| a |
| z |
| A1 |
| Z1 |
| a1 |
| z1 |
| { |
| | |
| } |
| ~ |
| — |
| É |
| é |
| É1 |
| é1 |
The two-character entries such as A1 demonstrate that A and a are at the same position.
Server issue
It has been observed that the server replaces a regular space before "!" by a non-breaking space  , affecting the sorting order. To avoid this, this blank space can be coded as  
Browser issues
With older versions of Safari a table can only be sorted by the first column: all sort buttons have the effect that only the leftmost one is supposed to have.
See also
- Template:Ml
- Template:Tiw - sorting a table by a date column, while following w:Wikipedia:Manual_of_Style_(dates_and_numbers)#Dates_containing_a_month_and_a_day for display
- w:Category:Sorting templates
- Template:Tim - shows buggy date sorting when some or all dates are linked
- Help:Table
- wikibits.js - contains, among other things, the sorting code
- changes regarding sorting:
- Sep 2008: allow negative numbers and scientific notation in determining numeric sort mode
- Nov 2007 allow multiple commas in numbers - from [1]
- Feb 2007 allow pound and euro in currency sort mode
- Jan 2007 sorttable.js merged into wikibits.js
- for older revisions see the revision history of sorttable.js
- Template:Mlm page overriding function ts_parseFloat(num) and function ts_resortTable(lnk) on Meta with improved versions
- sv:MediaWiki:Common.js page overriding function ts_parseFloat(num); adaptation to decimal comma
- proposed changes: [2] [3] [4] [5] [6] [7] [8] [9] force sortorder of a column more numbers [10]
- changes regarding sorting:
- bugzilla:2001 - resolved feature request
- bugzilla:8063 - request to enable sorting of numbers with a point as thousands separator
- bugzilla:8115
- http://www.kryogenix.org/code/browser/sorttable/ - explanation of the original version of the code by Stuart Langridge; an improvement in the MediaWiki version is that tables no longer need to have an id.
- http://blog.webkist.com/archives/000043.html
- http://www.joostdevalk.nl/code/sortable-table/
- w:Wikipedia:Wikipedia Signpost/2007-01-02/Technology report
- Template:Tiw
- mw:Extension:Sort2
- mw:Extension:Sort
- w:User:TimR/Tables
Examples elsewhere:
- w:Ranked list of Dutch provinces
- w:List of countries by GDP estimates for 2006 (nominal)
- w:List of countries by GDP (PPP), 2006
- w:List of longest reigning current monarchs - date columns are sortable for people with "no preference" for date formatting, and for people with preference [[YYYY-MM-DD]].
- Pokémon table - prefixes numbers with "#" to have them before "-".
- Nuclear power by country (Featured List)
- w:Desert Island Discs: castaways' choices
- zh:秘鲁行政区划 (Subdivisions of Peru) for sorting of Chinese (CJK)
- w:Standard electrode potential (data page)