moses toh
moses toh

Reputation: 13162

Change column order with jQuery DataTables

My code is like this : http://jsfiddle.net/oscar11/ebRXw/805/

$(document).ready(function() {
    var table = $('#example').DataTable( {
        "responsive": true
    } );
} );

In my example:

I want to change it to be like this without changing the HTML:

Upvotes: 4

Views: 15989

Answers (2)

davidkonrad
davidkonrad

Reputation: 85518

You could include the ColReorder plugin and reorder the columns upon initialisation :

$(document).ready(function() {
    var table = $('#example').DataTable( {
        "responsive": true,
        colReorder: {
          order: [5,4,3,0,1,2]
        }
    } );
} );

forked fiddle -> http://jsfiddle.net/8qrqpjsp/

Upvotes: 3

Gyrocode.com
Gyrocode.com

Reputation: 58860

SOLUTION

Use columns.data to set data source index for each column.

var table = $('#example').DataTable( {
    "responsive": true,
    "columns": [
        { "data": 5 },
        { "data": 4 },
        { "data": 3 },
        { "data": 0 },
        { "data": 1 },
        { "data": 2 }
    ]
} );

Don't forget to adjust table headings in thead section accordingly.

DEMO

See this jsFiddle for code and demonstration.

Upvotes: 7

Related Questions