views:

196

answers:

2

I'm not sure what's going wrong here. This is the page: http://www.utexas.edu/ssw/cswr/projects/project-list/

The first column sorts, but it isn't returning data in the correct order (alphabetical).

The table itself is being generated by a custom PHP function that pulls info from a WordPress database. I thought that might be the issue, but as you can see the fourth column (End Date) sorts correctly. I also thought it might be the links in the first column that were messing things up, but adding the text-extraction code from this page broke the sorting altogether.

This is the jQuery code I'm current using to call Tablesorter:

<script type="text/javascript" id="js">

   jQuery(document).ready(function($) { 
       $(document).ready(function() {
          // call the tablesorter plugin, the magic happens in the markup
          $("#projectTable").tablesorter({ 
              // pass the headers argument and assing a object 
              //debug: true,
              //sortList: [[0,0]],
              headers: { 
                  0: { 
                  // set the column to sort as text  
                      sorter: 'text',
                  },
                  // assign the secound column (we start counting zero) 
                  1: { 
                      // disable it by setting the property sorter to false 
                      sorter: false,
                  }, 
                  // assign the third column (we start counting zero) 
                  2: { 
                      // disable it by setting the property sorter to false 
                      sorter: false
                  },
                  3: {
                        sorter:'digit'
                  }
              }


          });

               // Works only with plugin modification
                $("#projectTable").bind("sortStart",function(e) { 
                    if( $(e.target).hasClass('header') ) {
                        $("#overlay").show();
                    }
                }).bind("sortEnd",function(e) {
                    if( $(e.target).hasClass('header') ) {
                        $("#overlay").hide();
                    }
                });

         });
    }); 
</script>

Thanks for your help!

+1  A: 

The problem is that it's sorting by the URL in the link rather than the text.

You may need to create a custom sort criteria (the textExtraction property) to fix that.

R. Bemrose
+1  A: 

You need to define textExtraction as complex since you have links in the elements.

See: http://tablesorter.com/docs/#options

Aaron Harun
I tried addingtextExtraction : complex,just before the 'headers' line in the code above but it breaks the sorting altogether. I've also tried all the examples listed in the documentation as regards textExtraction but they didn't work either - I'm probably not putting them in the right place? thanks for your help!
McGirl
never mind!! :) I added single quotes around the word 'complex' and it worked. Thank you!
McGirl
You're welcome.
Aaron Harun