sorting HTML tables with displaytag JSP tab library

Question

Hi,

I'm using the JSP displaytag tag lib to create HTML tables. I'd like the user to able to click on a column header in order to sort the data. My JSP code is shown below:

<display:table name="tableData" id="stat" sort="page">
  <display:column property="name" title="Name" sortable="true"/>
  <display:column property="age" title="Age" sortable="true"/>
</display:table>

I thought this would cause the data to be sorted on the client-side (in JavaScript), but what it actually does is create a broken hyperlink on the column header back to the server.

Is it possible to use displaytag to sort data on the client-side? If so, how?

Cheers, Don

Answer 1

Take a look at using jquery and its excellent tablesorter API. This will let you sort the table on the client side using Javascript.

Answer 2

As far as I know, this is not possible. JQuery's tablesorter may work for the small tables that it uses for its examples, but most tables have to come from an actual database. This hit is far too great to simply retrieve all the data before returning to the client with this information, and then allowing it to be sorted.

Displaytag has a "requestURI" element for the tag that allows its requests to go to your configured url-handler.

So, if you use this:

<display:table requestURI="yourUrlMappedController.yourExtension" ...>

This will allow for the stopgap solution of retrieving the data again from your controller.

Ultimately, though, you'll want to eventually work out a strategy that uses the displaytag sorting parameters to use as options in your "order by" clause and page the data from the database instead of pulling it all at once. This is a tricky thing to do, but the upfront effort can be very rewarding in terms of performance.

The displaytag site has three things you should always check for reference, just as an aside. The Tag Reference, the Configuration Guide and, of course, their (downloadable) Live Examples.