How to enable sortable table in DokuWiki
DokuWiki's default table is nothing but static HTML table. If you're looking to automatically sort your tables in DokuWiki with your default installation, then you're out of luck. Luckily there are plugins that can help extend DokuWiki's table function.
SortableJS
This plugin will enable sortable table by adding a some JavaScript codes to the page that enables the sorting function..
Installation
You can get the plugin to be installed here;
http://koti.mbnet.fi/oiv/pubtest/sortablejs.zip
You can refer to this article if you're not sure how to install a DokuWiki plugin
After you have installed the plugin, it'll take a day (depending on your DokuWiki setting) before you can see the changes, or you can refer to the following article to do it manually.
Usage
Basic
To have a sortable table, you just need to wrap your table
code with <sortable>
and </sortable>
tag as the following;
<sortable> ^Column 1^Column 2^Column 3^ |1|Row one|first| |2|Row two|second| |3|Row three|third| </sortable>
It'll sort the table based on the first column and produce the following table as output
<sortable>
Column 1 | Column 2 | Column 3 |
---|---|---|
1 | Row one | first |
2 | Row two | second |
3 | Row three | third |
</sortable>
Sort by column
To sort by specific column, just column number in the sortable
tag's heading. Consider the following example
<sortable 2> ^Column 1^Column 2^Column 3^ |1|Row one|first| |2|Row two|second| |3|Row three|third| </sortable>
The output is as the following, where the table's content is sorted based on the second column.
<sortable 2>
Column 1 | Column 2 | Column 3 |
---|---|---|
1 | Row one | first |
2 | Row two | second |
3 | Row three | third |
</sortable>
Sort by column in reverse
Adding r2
to the sortable
tag as in the following example will reverse sort the second column.
<sortable r2> ^Column 1^Column 2^Column 3^ |1|Row one|first| |2|Row two|second| |3|Row three|third| </sortable>
Here's the output of the above code.
<sortable r2>
Column 1 | Column 2 | Column 3 |
---|---|---|
1 | Row one | first |
2 | Row two | second |
3 | Row three | third |
</sortable>
Dynamic
Clicking on the column's table header will sort the table based on the clicked column. Clicking it again will reverse sort it.