I’m using WordPress and the Genesis framework and a child theme. I’m trying to use the jQuery plugin tablesorter to make a sortable table. I have a table created by PHP on a page template like so:
<table id="propTable" class="tablesorter">
In my functions.php
file, I have this code:
add_action( 'wp_enqueue_scripts', 'tablesort_script_add' );
function tablesort_script_add() {
wp_enqueue_script(
'jquery-tablesorter',
get_stylesheet_directory_uri() . '/js/tablesorter-master/js/jquery.tablesorter.js',
array('jquery')
);
}
I’ve made sure that the directories are correct, but it doesn’t seem to work. I don’t know if it is a problem with the tablesorter js file, or with the child theme/Genesis framework I’m using overriding or otherways interfering with the script.
It might also be a problem with me needing to write another script file to activate or implement the tablesorter for a specific table. If anyone could let me know which one of these I need to add or fix, and give me some pretty specific, beginner-level instructions on how to get there, it would be greatly appreciated! Thanks.
I figured out my own problem!
So it seems that the loop I was using to go through posts and create my table was actually creating a new
<tbody>
tag for each row, so only the first row of the table was getting sorted.If anyone else is having the same problem with tablesorter, some other things I had to do were make sure I only loaded one jQuery (using it as a dependency is enough), and making sure that you pass the $ through as a parameter in your jquery.tablesorter, since wordpress automatically uses jquery’s noconflict mode and the $ isn’t valid as a global variable for jQuery.