Column sort not working with FixedHeader and Ajax source

valdezr

I took the ajax.html example with this configuration

[code]

@import "../../media/css/demo_page.css";
@import "../../media/css/demo_table.css";





$(document).ready(function() {
var oTable = $('#example').dataTable( {
"bProcessing": true,
"sAjaxSource": '../support/source.txt'
} );
new FixedHeader( oTable );
} );

[/code]

but when I try to sort a column, an error occurs in FixedHeader.js on this function indicating that the variable 'that' is not defined.

[code]
/* Add an event handler to update the display when sorting occurs - note that the clone above
* will copy the sorting function from the main table
*/
jQuery('thead th', nTable).click( function () {
that._fnCloneThead( oCache ).call(that);
} );
[/code]

If the source is not Ajax or server side, it works fine.

I hope somebody can help me to discover what it is wrong.

Thanks in advance.

valdezr

I noticed that if I comment these lines in FixedHeader.js

[code]
jQuery('thead th', nTable).click( function () {
that._fnCloneThead( oCache ).call(that);
[/code]

then it works fine; So they are not needed?
Or in what cases are them used?

Thanks for your help

domingo

Those lines also cause the same error when a column is set to "bSortable": false and you click on that column header

I fixed it by changing the lines to
[code]
jQuery('thead th.sorting', nTable).click( function () {
that._fnCloneThead( oCache ).call(that);
} );[/code]

I'm not sure if that fix applies to your problem, but you can give it a try

Regards

valdezr

Yes, it worked just fine.
Thanks a lot

valdezr

Sorry, I thought it was right but there was a cache problem and
when the browser really took the modified version,
the problem keeps the same.

allan

Thanks for pointing this out. I believe the following piece of code is actually redundant:

[code]
/* Add an event handler to update the display when sorting occurs - note that the clone above
* will copy the sorting function from the main table
*/
jQuery('thead th', nTable).click( function () {
that._fnCloneThead( oCache ).call(that);
} );
[/code]
If you just cut it out and then reload the table in your browser (clearing the cache :-) ) it should work okay. Either way, ping us back here to let us know how it goes, and if it does address the problem, I'll release a new version with this update.

The reason that I don't think this code is needed any more, is that the FixedHeader will update on the draw callback - and that includes a call to _fnCloseThead.

Regards,
Allan

valdezr

Thank you very much for your support Allan,
Indeed, as I commented, deleting this code fragment works fine!

allan

Excellent - thanks for the update. I'll release a small update with that change shortly.

Allan