Sortable Tables adds on to the core Tables component, allowing the table to be sorted by the header row. Some custom sorting options are available.
|Included in AUI core?||Not in core You must explicitly require the web resource key.|
|Web resource key:||
|AMD Module key:||N/A|
|TEST-12||Cannot sort tables||2||Table sorting should be allowed|
|WIN-87||Issue Page doesn't load in IE||7||When loading issue page on IE it doesn't show|
|DRINK-7||Vending Machine is empty||1||Blocker|
To make a table sortable, you must add the
CSS classes to the table and also define the <thead> of the
Sortable Tables are determined at page load, so if a table is added to the DOM after page load then it must be declared as sortable in your own code.
Sortable tables attempt to automatically detect the best sorting method for a given column.
The sorting method can be explicitly set by adding a CSS class to a column's
Most of the sorting methods are provided by
the jQuery tablesorter plugin.
Some custom sorting methods provided by AUI include:
aui-table-column-issue-key: Sorts JIRA issue keys so that they are in the correct ordering by project and then by issue id.
aui-table-column-unsortable: Disallows any sorting of this column.
Through the jQuery tablesorter plugin API, it is possible to define your own sorting behaviour. The following is an example of how you might order a "Priority" column using a non-alphabetical sort order.
To set a table as sortable, you must pass a jQuery object for the table into the
Assigning a table as sortable multiple times can result in undefined behavior. For example, if a sortable table is
present on page load and then you assign it as sortable via the
function, it is unlikely to work as expected.