Reputation: 10063
This question has been asked and answered several times but none of the answers worked for me.
I recently updated from JQuery 1.x to 3.x and that is when the arrows disappeared.
Here is the code:
<html>
<head>
<title>Inspections</title>
<link rel="Stylesheet" href="css/theme.blue.css" type="text/css" />
<script type="text/javascript" src="js/jquery-3.2.1.js"></script>
<script type="text/javascript" src="js/jquery.tablesorter.min.js"></script> <!-- 2.17.8 -->
</head>
<body>
<div id='inspectionoutstandingdiv'>
<h1>Inspections
</h1>
<table id='activeinspections' class='tablesorter'>
<thead>
<tr>
<th>Field 1 </th>
<th>Field 2 </th>
</tr>
</thead>
<tbody>
<tr>
<td>Some Data 1 </td>
<td>Some Data 2 </td>
</tr>
</tbody>
</table>
</div>
<script type="text/javascript">
$('#activeinspections').tablesorter({theme:'blue'});
</script>
</body>
</html>
One of the suggestions is to get the .gif files placed in the correct stop or to modify the css to point to the the .gif files, but when I opened up theme.blue.css I noticed that the .gif files are embedded in the .css as encoded text.
I ran with the browser debugger to see if it was complaining about files it could not load.
This code was working under an older version of jq and tablesorter that used individual .gif files for the arrows.
What I am doing wrong that the arrows do not show up?
Per Mottie's suggestion I added theme: 'blue'
to the tablesorter call, but that did not help.
I then changed class='tablesorter'
to class='tablesorter-blue'
and that worked. I don't think that is an ideal solution so I would still like an answer.
Upvotes: 0
Views: 453
Reputation: 10063
The problem was that I was using a .zip file named Mottie-tablesorter-08bf513.zip when I should have downloaded Mottie's code from github directly.
The correct code has a comment that looks something like this:
/*! TableSorter (FORK) v2.xx.xx *//*
Upvotes: 1