Usage

Initialisation and configuration of RowReorder is performed through the rowReorder initialisation option for DataTables. This option can be given as a simple boolean value to enable RowReorder with its default values, or as an object to provide more granular control.

Simple initialisation

In its most simple case, you can enable RowReorder by simply setting rowReorder: true as an option in the DataTables initialisation:

new DataTable('#myTable', {
    rowReorder: true
});

If you do this, you may wish to use the row-reorder event to know when the end user has completed an action with RowReorder, so any changes can be fed back to a database.

Options

For more complex cases, the rowReorder option can be used as an object allowing you to specify specific columns, pre-set column order, etc. In the following case, rowReorder.dataSrc is used to tell the software the property name to use for the data swap action:

new DataTable('#myTable', {
    ajax: '/api/data',
    columns: [
        { data: 'sequence' },
        { data: 'name' },
        { data: 'position' },
        { data: 'office' },
        { data: 'extn' },
        { data: 'start_date' },
        { data: 'salary' }
    ],
    rowReorder: {
        dataSrc: 'sequence'
    }
});

Object based data

If you are using object based data, you must use rowReorder.dataSrc to tell the software what data point you want the grouping to happen on (the default is 0 which looks for an array - i.e. the table is being read from HTML, for Ajax tables you will most likely want to use rowReorder.dataSrc), as shown above.

Reference

For a complete list of the options that RowReorder supports, please refer to the DataTables initialisation options reference. The RowReorder examples also demonstrate the options available.