Added FixedHeader and can no longer sort columns

Added FixedHeader and can no longer sort columns

tobtobtobtob Posts: 5Questions: 0Answers: 0
edited January 2014 in FixedHeader
I've had datatables working fine on this page for a while.... I added FixedHeader which works fine (keeps header at top while scrolling) but column sorting is no longer working. I don't see any js errors.
Here is a working page without FixedHeader: http://www.teetimegolfpass.com/ne/golfcourses1.php?region=NE
Here is the failing page: http://www.teetimegolfpass.com/ne/golfcourses.php?region=NE
Here is the code on the page:
[code]
oTable = $('#example').dataTable( {
"iDisplayLength": 50,
"aoColumnDefs": [
{ "bSortable": false, "aTargets": [ 0 ] }
],
"aaSorting": [[0, 'asc']]
});
new FixedHeader( oTable);

} );
[/code]

Thanks in advance for any help you can provide.

Replies

  • tangerinetangerine Posts: 3,365Questions: 39Answers: 395
    Your "failing" page has different DataTables initialisation. Is that intentional?
  • tobtobtobtob Posts: 5Questions: 0Answers: 0
    No, not intentional. Anything different was done in an attempt to fix the problem.

    If I comment out ONLY the FixedHeader line the tables orting works fine. See this page. It's a duplicate of the failing page with the FIxedHeader line commented out.

    http://www.teetimegolfpass.com/ne/golfcourses2.php?region=NE
  • allanallan Posts: 63,489Questions: 1Answers: 10,470 Site admin
    Can you try updating your FixedHeader to 2.1.0 release please? I see you are using a dev version.

    You'll need use `new $.fn.dataTable.FixedHeader( ... )` to initialise the FixedHeader as there is no longer a global variable.

    Allan
  • tobtobtobtob Posts: 5Questions: 0Answers: 0
    I'm definitely not a JS expert, barely a novice, so excuse me for asking for more detail but here's how I changed the code and now I'm getting an error about "$.fn.dataTable.FixedHeader not a constructor.

    I Also updated to 2.1.0

    [code]
    var oTable = $('#example').dataTable( {
    "iDisplayLength": 50,
    "aoColumnDefs": [
    { "bSortable": false, "aTargets": [ 0 ] }
    ],
    "aaSorting": [[0, 'asc']]
    });
    new $.fn.dataTable.FixedHeader( oTable)
    /*new FixedHeader( oTable);*/

    } );
    [/code]
  • allanallan Posts: 63,489Questions: 1Answers: 10,470 Site admin
    Looks like you are loading DataTables twice on your page for some reason. The second one is overwriting the first, which has FixedHeader attached to it. Load it just once.

    Allan
This discussion has been closed.