DataTables logo
≡

Ordering plug-ins

DataTables provides two APIs for ordering information in a table:

  • Type based ordering
  • Custom data source ordering

By far the most commonly used of these two types is "type based ordering" and is the one you are most likely to want to use if just starting out with DataTables.

Type based ordering

The main DataTables package includes ordering functions for strings, dates, numeric and currency data, but you may very well wish to order data in some other manner, for example date formats not built in. The ordering functions below provide a wealth of different ordering methods that can be used with DataTables.

It is also worth noting that ordering function go hand-in-hand with type detection plug-ins, and many of the ordering plug-ins below has a corresponding type detection function to make installation very easy and we strongly recommend taking this approach.

How to use

To add the ability to sort specific data types, using the plug-in functions below, you need to include the plug-in's code in the Javascript available for your page - then if you use a suitable type detection plug-in the new ordering will be applied automatically, you to might need to use the columns.type parameter for the target column if there is no type detection plug-in available.

Browser

Loading a ordering plug-in directly in the browser is just a case of loading the Javascript for the plug-in (after you have loaded the core DataTables Javascript). As an example the code below makes use of the anti-the plug-in saved into a file:

<script type="text/javascript" src="dataTables.js"></script>
<script type="text/javascript" src="dataTables.antiThe.js"></script>
<script type="text/javascript">
    var table = new DataTable('#myTable', {
        columnDefs: [
            {
                target: 0,
                type: 'anti-the'
            }
        ]
    });
</script>

Plug-ins which can be included in the browser are available on our CDN. See the details page for each plug-in for the full CDN URL.

ES modules

The ordering plug-ins are also available as ES modules, which can be loaded from the datatables.net-plugins package (.mjs files). You need to include the file required for the plug-in. Below we use the example of anti-the again:

import DataTable from 'datatables.net';
import 'datatables.net-plugins/sorting/anti-the.mjs';

var table = new DataTable('#myTable', {
    columnDefs: [
        {
            target: 0,
            type: 'anti-the'
        }
    ]
});

Plug-ins

Case-Sensitive Sort based on case of data, In ascending order capitals are prioritised over lower case.
Absolute sorting Keep one or more items at the top and/or bottom of a table when
Alt string Use the `alt` attribute of an image tag as the data to sort upon.
Anti-"the" Sort with the prefixed word `dt-string The` removed, if present
Any number Sort column with mixed numerical content by number
brackets-negative Detect data of currency type with a leading currency symbol as well
Case-Sensitive Sort based on case of data, In ascending order capitals are
chapter Sort book chapters numerically
Chinese (string) Sort Chinese characters
Currency Sort data numerically when it has a leading currency symbol.
Czech Sort locale aware sorting for Czech.
Date (dd-mmm-yyyy) Sort dates in the format `dd-mmm-yyyy`
Date (dd.mm.YYYY) or date and time (dd.mm.YYYY HH:mm) Sort date / time in the format `dd.mm.YYYY HH:mm` or `dd.mm.YYYY`.
Date (dd . mm[ . YYYY]) Sort dates in the format `dd/mm/YY[YY]` (with optional spaces)
Date (dd/mm/YYYY hh:ii:ss) Sort date / time in the format `dd/mm/YYYY hh:ii:ss`
Date (dd/mm/YY) Sort dates in the format `dd/mm/YY`
Ultimate Date / Time sorting Sort date and time in any format using luxon
Ultimate Date / Time sorting Sort date and time in any format using Moment.js
Diacritics-neutralise-sort Better sort of strings containing accented characters (diacritical marks)
enum Dynamically create enum sorting options for a DataTable
Farsi numbers Sorts columns containing UTF8 Farsi numbers
File size Sort abbreviated file sizes correctly (8MB, 4KB, etc)
Formatted numbers Sort numbers which are displayed with thousand separators
intl Sort string data using the Intl Javascript API
IP addresses Sort IP addresses numerically
Date (MM YY) This sorting plug-in will sort, in calendar order, data whichis in the format "MM YY".Please note that this plug-in is **deprecated*. The[datetime](//datatables.net/blog/2014-12-18) plug-in provides enhancedfunctionality and flexibility.
Natural Time Delta Sort human readable time delta
Natural sorting Sort data with a mix of numbers and letters _naturally_.
Nepali numbers Sorts columns containing UTF8 nepali numbers
novalue.js Sort any "novalue" pattern as max or min (e.g. '-' treat as -1000 or 1000).
Numbers with HTML Sort data which is a mix of HTML and numeric data.
numString Sorting for number value that is included anywhere in a regex.
Commas for decimal place Sort numbers correctly which use a comma as the decimal place.
Percentage Sort numeric data with a postfixed percentage symbol
Persian Number Sorting Sorts columns containing UTF-8 Persian numbers
Persian Sort Persian strings alphabetically
Scientific notation sorting Sort data which is written in exponential notation.
Fully signed numbers sorting Sort data numerically with a leading `+` symbol (as well as `-`).
Date (MMM yyyy) or (MMMM yyyy) This sorting plug-in will sort, in calendar order, data whichis in the format "MMM yyyy" or "MMMM yyyy". Inspired by forum discussion:http://datatables.net/forums/discussion/1242/sorting-dates-with-only-month-and-yearPlease note that this plug-in is **deprecated*. The[datetime](//datatables.net/blog/2014-12-18) plug-in provides enhancedfunctionality and flexibility.
Time span Sort abbreviated time span correctly (2d 3h, 2h 8m, 3m 8s, 30s, etc)
Time (dd/mm/YY) Sort Times in the formats: `hh:mm, hh:mm:ss, hh:mm tt, hh:mm:ss tt`
Hidden title numeric sorting Sort data numerically based on an attribute on an empty element.
Hidden title string sorting Sort data as a string based on an attribute on an empty element.
Turkish Sort Turkish characters

Custom data source sorting

Custom data source ordering plug-ins allow complete control of the data that is to be sorted. Typically this is used to retrieve data live from the DOM just prior to the table being sorted, to perform ordering on data that can be updated by the end-user or by some other script.

You can also use type based ordering in-combination with custom data source ordering as the data returned by the custom data source ordering plug-in is processed in exactly the same way as automatically retrieved data.

Please note that custom data source ordering plug-ins will often query the DOM for information which can degrade performance. Thus, if it is possible for you to use type based ordering (above) or orthogonal data, it is recommended that you do so.

How to use

To make use of the custom data source ordering plug-ins below, you simply need to include the plug-in's code in the Javascript available for your page, after you load the DataTables library, but before you initialise the DataTable. You also need to specify the columns.orderDataType parameter for the column, to tell it which plug-in function to use.

The example below shows the use of multiple custom data source plug-ins, and also its use in-combination with columns.type (live example):

<script type="text/javascript" src="dataTables.js"></script>
<script type="text/javascript" src="dataTables.dataSourcePlugins.js"></script>
<script type="text/javascript">
    new DataTable('#myTable', {
        columns: [
            null,
            null,
            {orderDataType: 'dom-text'},
            {orderDataType: 'dom-text', type: 'numeric'},
            {orderDataType: 'dom-select'},
            {orderDataType: 'dom-checkbox'}
        ]
    });
</script>

Plug-ins

The custom data source functions are used to update the cached data in DataTables, so ordering can occur on columns with user input information.

Checkbox data source Sort based on the checked state of checkboxes in a column
Select menu data source Sort based on the value of the `dt-tag select` options in a column
Input element data source Sorting based on the values of `dt-tag input` elements in a column.
Input element data source Sorting based on the values of `dt-tag input` elements in a column.