Question

I have two Tablesorter tables in my website demo, which can be accessed by either clicking Events or Venues at the very top.

In IE8, the Events table loads fine, while the Venues table does not.

specifically, the problem I have is that in Venues top sorting part doesn’t load and neither does the Zebra widget.

Here is the code I have for them:

events

function configureEvents() {
    $('#whole-ajax-content-one').load('events.html', function() {
        $("#eventsTable").tablesorter({  
            headers: {  
            0: { 
                sorter: false 
            }
            },
                widgets: ['zebra']
            }); 


            window.setTimeout(function() {
                $('.scroll-pane').jScrollPane();
                jQuery("#all_events_button").addClass("topActive");
                jQuery("#today_button").addClass("timeframeActive");
                $("#partypreloader").fadeOut("slow");
            }, 150);            
    }); 
}

venues

function configureVenues() {
    $('#whole-ajax-content-one').load('venues.html', function() {
        $("#venuesTable").tablesorter({  
            headers: {  
            0: { 
                sorter: false 
            }
            },
                widgets: ['zebra']
            }); 

        window.setTimeout(function() {
            $('.scroll-pane').jScrollPane();    
            $("#partypreloader").fadeOut("slow");
        }, 150);
    });
}

They both have different names so I doubt there’s some sort of a collision happening. Anyway, thanks for your time everyone! 🙂

Answer 1

OMG… took me forever to figure it out LOL.

Basically the venues table has the class “tablesorter2″… change it to “tablesorter” and everything should work – it was sorting, just not applying the styling to LOOK like it was applied.