ColReorder Sorting Issue (Shown in your demo)

jimmyh

Hello,

There is an issue with the ColReorder library in that if you re-order columns and then try to sort on them, the sorting is performed on the data of the column where you previously dragged the column from, if that makes sense?

For example if I have the following columns:

Id, Name, Age, Gender

And I move Age to be before Name and then sort on Age, the sorting will occur on Name.

You can see it happening in your live demo here: http://www.datatables.net/extras/colreorder/


If I've made no sense whatsoever let me know and I'll provide an extensive demonstration.


Cheers

allan

This is due to an incompatibility between ColReorder and DataTables 1.8.0. Basically the ColReorder version which comes with DataTables 1.8.0 hasn't been updated for the new way DataTables works with column headers (an oversight on my part - sorry). There is a fix available in the 'nightly' version of ColReorder here: http://datatables.net/download/ which will be packaged up into a release soon.

Allan

jimmyh

Hi Allan,

I am using the lastest nightly builds for DataTables, ColVis and ColReorder and I still get this bug unfortunately!

jimmyh

Hi Allan,

Do you need me to provide any demonstrations for this?


Cheers

allan

Yes please, if you are still seeing this issue with the nightlies then a link to a demo would be very useful!

Thanks,
Allan

jimmyh

Hi Allan,

IE build 8.0.6001.18702 isn't displaying any JavaScript errors on the page sorry! I am using jQuery 1.5.2 (as I still cannot get 1.6.1 to work with ColVis) the following JavaScript setup:

$("#TableName").dataTable({
"bJQueryUI": true,
"bPaginate": false,
"bLengthChange": false,
"bFilter": false,
"bProcessing": true,
"bSort": true,
"bSortClasses": false,
"bInfo": true,
"bAutoWidth": true,
"sDom": '<"H"C<"clear">>Rrtl<"F"i>',
"oColVis": {
"buttonText": "Show/Hide Columns"
}
});

And the following HTML DOM:

Rendering engineBrowserPlatform(s)Engine versionCSS gradeTridentInternet Explorer 7Win XP SP2+75.6TridentAOL browser (AOL desktop)Win XP61.9GeckoFirefox 1.0Win 98+ / OSX.2+1.74.1GeckoFirefox 1.5Win 98+ / OSX.2+1.83.7

I have tried playing with the DataTables options, DOM configuration properties but to no avail. Hope that helps!

allan

> I still cannot get 1.6.1 to work with ColVis

Can you post a link to an example of that please? I've been using ColVis nightly with jQuery 1.6.1 with no problems.

With regard to your problem above you say that no Javascript error is thrown - so in what regard is it not working? Do you not have access to the ColVis controls or do they not do anything? Again if you can link to your example that would be very useful as there could be some interaction with other code / elements on the page.

Allan

jimmyh

Hi Allan,

I'm afraid due to NDA I cannot really post the full project example, but even when I run a very simple test in IE8 with jQuery 1.6.1 and ColVis and ColReorder the ColVis shows but just doesn't work. And with jQuery 1.5.2 (or 1.6.1) in IE8 the columns don't always resize to 100% of the table width with ColVis, which can be seen in 2 of your live demo examples too.

The ColReorder issue doesn't post any JavaScript errors on page either, as it technically does do the sort it just does it on the wrong index after a column has been moved elsewhere.


Cheers!

jimmyh

Hi Allan,

Sorry to be a pain, but have you had a chance to investigate the cause for this?


Cheers!

allan

I released new versions of ColVis and ColReorder over the weekend - could you try it with them please. They address a number of bugs and other things, so it is quite possible that they will fix what you are seeing (they should from your description).

Allan

jimmyh

Hi Allan,

Hi Allan,

I have checked the latest builds and this bug still exists on my system and on your demo posted in my first post:

- DataTables: 1.8.1
- ColVis: 1.0.5
- ColReorder: 1.0.2


Cheers!

tedtedson

allan,
i'm also still seeing the issue. to see the problem in the colreorder demo, follow these steps:
-load the demo: http://www.datatables.net/extras/colreorder/
-click on the "Browser" column header to sort - you'll see the sorting is correct
-drag the "Browser" column one spot to the right, so it follows "Platforms"
-click the "Browser" column header to sort - you'll see it sorts the "Platforms" column (i.e., its old column position)

hope that helps, and thanks in advance for a final fix.

allan

How very embarrassing... I hadn't updated ColReorder to cope with how the data is read / set in DataTables 1.8 which meant that it was using out of date information...

I've just committed a proper fix which you can download from the ColReorder nightly here: http://datatables.net/download/ . Could you confirm if that does the job for you? If so I'll release the fix as a new version.

Regards,
Allan

tedtedson

allan,
works like a charm. :)

thanks a ton for the quick turnaround.

allan

Excellent! Thanks for the feedback. That change will become ColReorder 1.0.3 tomorrow when I package it up :-)

Regards,
Allan

jimmyh

Great, thanks so much Allan that's brilliant!

allan

Done: http://datatables.net/release-datatables/extras/ColReorder/ :-). ColReorder 1.0.3 can be downloaded from the downloads page: http://datatables.net/download .

Allan

jamesjburt

I have been having a couple of problems with colReorder also, that forced me to put some error-handling in the source.... for some reason, it often tries to use an object's methods without testing to see if it is available...



/**
* Modify an array by switching the position of two elements
* @method fnArraySwitch
* @param array aArray Array to consider, will be modified by reference (i.e. no return)
* @param int iFrom From point
* @param int iTo Insert point
* @returns void
*/
function fnArraySwitch( aArray, iFrom, iTo )
{
if(aArray.length != undefined) <<<<<<< Here is the Modification
{
// Conditional is a bugfix JJB 2011-07-06

var mStore = aArray.splice( iFrom, 1 )[0];
aArray.splice( iTo, 0, mStore );
}
//endIf
}


/**
* Switch the positions of nodes in a parent node (note this is specifically designed for
* table rows). Note this function considers all element nodes under the parent!
* @method fnDomSwitch
* @param string sTag Tag to consider
* @param int iFrom Element to move
* @param int Point to element the element to (before this point), can be null for append
* @returns void
*/
function fnDomSwitch( nParent, iFrom, iTo )
{
if(nParent != null) <<<<<<< Here is the Modification
{
// Conditional is a bugfix JJB 2011-07-06
var anTags = [];
for ( var i=0, iLen=nParent.childNodes.length ; i

allan

Could you try the latest development code? That would take care of the issues you raise. Previously all DataTables source data was arrays, hence there was no need for a test - however with 1.8 that is no longer the case. Likewise, previously it was assumed that the TD DOM nodes had always been created, which is no longer true if using deferred rendering. 1.8 has relaxed this assumption.

All good points!

Thanks,
Allan

james_burt

I tried these versions:

The nightly build of colreorder.min.js (1.0.4dev, Wed 6th Jul 2011, 07:03).
The stable build of colreorder.min.js (1.0.3, Tue 28th Jun 2011, 19:10).

With either of these, I no longer get the JS errors from fnDomSwitch() and fnArraySwitch().

However.....

Now the column is INVISIBLE while it is being dragged! (MSIE 7.0) LoL

For the moment, I think this fix is not correct........ I will stick with my hacked version of colreorder 1.0.1, so I can see the column while it is being dragged.



James

allan

Ah good old IE... I'll look into this - thanks for flagging it up.

Allan

hayde

in the current 181 download package (http://www.datatables.net/releases/DataTables-1.8.1.zip)
the old ColReorder 102 (which causes the bug this thread pointed at) is included instead of 103

salanox

very very very thanks :)

robmcquown

FWIW, downloading 1.8.1 includes version 1.0.2 of ColReorder still... might want to update the package. I was glad to find that solution was as easy as getting the most recent version, btw. :>

allan

The DataTables packages contain the stable release of each of the extras as they were at the time of building the package. The DataTables package isn't then updated for new releases of the extras to ensure that if you download a given version I/you know exactly what you are getting.

So yup - there can be cases where the extras ship a release that are ahead of the one that is available with DataTables. I'm planning of doing a bit of work to help with that situation soon, and also I'll be trying to stabilise all extras for the 1.9 DataTables release and include them in that package :-)

Allan

ChrisH

Allan,

I think this bug in ColReorder and sorting is still there; See: http://www.datatables.net/release-datatables/extras/ColReorder/index.html. Move 'Rendering Engine' one column to the right (swap 'Rendering Engine' and 'Browser') and sort on 'Rendering Engine'. The sort is based on the previous resident column, 'Browser'. Any thoughts?

Chris

allan

Hi Chris,

I'm afraid that this is a compatibility issue between DataTables 1.9.3 and ColReorder before 1.0.7.dev :-(. If you update to the latest nightly on the downloads page ( http://datatables.net/download/ ) for ColReorder, it should spring back to life.

There aren't any other outstanding issues on ColReorder that I am aware of, so I'll be packaging this up as 1.0.7 fairly soon.

Regards,
Allan

ChrisH

Great! Thanks for the quick reply (and for posting a new nightly!). A couple notes:

1. The version number is wrong in the nightly file header.
2. The "Description:" field in the header seems to be for ColVis, not ColReorder.

UPDATE: Hmm.. the "1.0.7 dev" Full JS file and the 1.0.6 version seem to be identical??
UPDATE2: Ahh, only the min JS is updated.

Cheers,
Chris

allan

I think you might need to reload the file / flush your cache. The uncompressed version is also updated when it builds :-).

Thanks for catching the ColVis description in the ColReorder header - fixed.

Allan

hkn

I still have same issues while I am populating table with ajax requests. ('bServerSide': true)

Issue 1 : Swap two columns and sort one of them. Contents of these columns are changing to initial state.

Issue 2 : Swap two columns and hide one of them with ColVis. Swapped column is hiding instead of the selected one. Also headers of columns are wrong. After enabling the hidden column, headers of them are still in wrong place.

I have these libraries;

jquery 1.8.2
dataTables 1.9.4
ColReorder 1.0.8 or ColReorderWithResize.js 1.0.7 (Both behaves same)
Colvis 1.0.8

Also everything looks work fine without ajax requests with 'bServerSide': false parameter.

Thanks in advance,
Hakan

HankLloydRight

Hello,

I'm also having this same problem with Server-side ajax requests, and just like Hakan above, I'm running:

jquery 1.8.2
dataTables 1.9.4
ColReorder 1.0.8 or ColReorderWithResize.js 1.0.7 (Both behaves same)

When moving columns around, the data on the moved column is replaced with the data in the column it replaced. In other words, if I move a column to the left, it properly moves the column data and column header. But once I sort, that column data is replaced with the data that was in that position previously. The actual column order in the table has not changed, as the original data is still sortable in it's original column, only the header has changed as a result of the column move.

Or even in other words, after a column move and sort (on any column) the column data is in the same order (left to right), but only the headers have moved.