Search code examples
jquerytablesorter

jQuery Tablesorter with jQuery 2.x


If I take any simple exmaple for jQuery Tablesorter and run it locally it works fine. If I replace the local link to jquery-latest with a link to a cdn for jquery 2.1.3, it's as if jQuery has not been loaded. All you have to do is replace the src in this "<script type="text/javascript" src="./js/jquery-latest.js"></script>" with
"cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js", and it is like jQuery is not loaded. For example, in the code for the demo for "pager" for Tablesorter: tablesorter.com/docs/example-pager.html

Am I missing something dumb, and obvious, and embarrassing, or does Tablesorter not work with the latest jQuery, or... ?


Solution

  • If you look at the development console (press F12), you'll see there is a javascript error - try it in this demo

    Uncaught TypeError: Cannot read property 'msie' of undefined

    This error is only seen when using jQuery v1.9+. This is because the pager code uses the plugin's internal clearTableBody function which checks jQuery.browser for IE, and because that function was completely removed in jQuery v1.9+, a javascript error occurs.

    So you have three options.

    1. Switch to always using jQuery less than v1.9.
    2. Modify the core plugin and replace this code:

      this.clearTableBody = function (table) {
          if ($.browser.msie) {
              while (table.tBodies[0].firstChild) {
                  table.tBodies[0].removeChild(table.tBodies[0].firstChild);
              }
          } else {
              table.tBodies[0].innerHTML = "";
          }
      };
      

      with this

      this.clearTableBody = function (table) {
          $( table.tBodies[0] ).empty();
      };
      
    3. Or, try out my fork of tablesorter which does not use jQuery.browser and has a bunch of enhancements, useful widgets and parsers. Sadly, most of the widgets are not compatible with the original tablesorter.