server-side processing and Colreorder integration

Nakakoue

Hello,

I ran into an issue recently on a project using the amazing plugin that is DataTables. The point is, I need to implement colReorder plugin on an existing Datatable. I also use the statesaving option, and process requests on server side.

Everything is working perfectly when initializing the datatable : the state is saved, and the order of columns is like what user selected before to leave my website.
However, when performing an action that needs to draw the table, the reordering fails. For example, my users can fill a form for a search, and with fnServerParams I will send those data to the server which will send back the result. I then use datatable.page(0).draw(). Or, when the user has several pages of results, he may click on pagination buttons, which will call a draw().
But those actions break the reordering. The header doesn't move, but the rows that are appended to it are not reordered, as if the reordering plugin was not notified. But before and after my call, I can catch the order array of colreorder, and it doesn't change.

I found out that statement on ColReorder examples, server-side processing:
"It is recommend that you use object based data with server-side processing and ColReorder, as this provides easily understandable mapping between the the columns and the data relation on the server, otherwise you need to work out array indexes on each call!"

I guess my problem lies here, as the server returns data as arrays. I do not wish, if possible, to update the server's answer as the classes used to create it are used elsewhere as well. So here is, eventually, my questions:
- why colReorder plugin isn't notified by the draw() function, as it could be reordering my data as well as it does it at refresh, since the indexes are still in the .order() array. Is it a intended behavior?
- what is the difference between the initial call and the draw()-induced calls, because I'll need to be aware of it in the code if I need to manually "work out array indexes on each call"?

I created a jsFiddle to help visualize my concern.
https://jsfiddle.net/Nakakoue/6L4guerv/3/

There are two datatables, one receives data as objects, the second one as arrays. If you invert two columns, and refresh the page, it's ok, working. But if you click on one of the pagination button, or on the below button (that simulate the search of my users), the second table gets messy.
I wish I could solve this without modifying my server code.