Tuesday, May 3, 2011

AJAX and being lazy with tablesorter

Now I love using other peoples' code.

I'm extremely lazy in terms of programming: if someone's written it, I'm going to use it. In fact, the first thing I do (except when I'm reinventing the wheel for learning purposes) is check to see if there's a library for problem X.

An example: we're using the DataTables jQuery plugin to make our tables look pretty. Now, data tables has some nice features:
  • Pagination 
  • Sorting
  • Searching (which updates the results instantly)
  • Easy to integrate (just a one liner) 
All these things make DataTables very attractive. So what's the problem? Well, recently we've been ajax-ifying one of our pages so that it's constantly reloading the same table. For some reason, DataTables doesn't like this (at least with our setup, if it's working for you feel free to share). The end-result is that we lose sorting ability when the AJAX reloads the table. That's a problem.

After spending some time looking for some solutions, we decided to drop DataTables in favor of tablesorter, another jQuery table plugin.

We decided to use tablesorter over DataTables for a couple reasons:
  • It wasn't working with our AJAX setup (as mentioned)
  • At first we were using the other features, but then we stopped using pagination and searching
  • tablesorter integrates just as easily
  • tablesorter is more light-weight (12kb vs 60kb) 
  • tablesorter works for our purposes with no exciting changes (we add a line in our success function to refresh the table) 
So for our purposes, tablesorter was the better option. And the best part is, it let us be as lazy as possible since integrating it took exactly three steps*:
  • download minified js file
  • add to project
  • add two lines of code to existing script files
Very convenient.


* apologies for the multiple bulleted lists, I do kind of like them though.

No comments:

Post a Comment