DisplayTag + JQuery = DisplayTagAjaxed

I have seen posts/blogs/articles about ajaxing displayTag. I first put my hands on ajaxTags. It seemed to work fine but once the application was ported to Weblogic 8.1 SP6 it stopped working. This is mainly because of the conflict with standard.jar.

I looked at AjaxAnywhere and although I didn’t use it, I found the implementation grammar long.

All I wanted was something that will not want me to make modifications to the applications deployment descriptions or include any jar files etc.

So I decided to write my own and no not any wrappers around the displayTag taglibrary but by simply using JQuery. 100% pure JS.

The thought process was simple, the pagination/sorting should not reload the page but just call a JS function which will do the magical ajax call, fetch the data and replace the html contents..

A live demo can be seen at here

Posts to follow on documentation and how-to’s. If you are in a hurry..just do a view-source and grab the JS files. If anyone needs the sample application source and/or war file, email me at write2vijay at gmail dot com


22 Responses

  1. Based in your idea I have made the following code:

    $(function() {
    $(‘span.pagelinks>a, table#dispTable>thead>tr>th>a’).live(‘click’, function(){
    , function(responseText, status, xmlHttpRequest){
    $(‘#ajxDspId’).html($(‘#ajxDspId’, responseText).html());
    return false;

    • I’m trying to do something similiar, in a jsp with a displayTag list included in a main form jsp.
      But it doesn’t work, it always turn back with an empty list.
      Any help or idea?

      My code looks like that:
      urlTotal = actual.href.split(“?”);
      url = urlTotal[0];
      data = urlTotal[1];

      • Hard to tell without the full HTML code.
        Is your collection object in jsp response object or in session?

    • OMG it works! Thank you. I don’t understand much about the code, but it works, i’m trying to study it. 🙂 and im trying to find a way to apply it to all my displaytags with less js 🙂 thanks again

  2. simply GREAT!

    this saved my ass on a struts2+jquery+displaytag project

    very nice the client side replacement with jquery


  3. I wanted to know how can i do this while doing drilldown on displayTag table… I tried the above script it works for next page, when I do drill down it does not

    • You probably need to tweak the JS file. Can you give me an example on what you are trying to achieve?

  4. Can I send a URL parameter indicating the page I want my table to be selected???

  5. Hi vijay can we ajaxify a display tag using partial list.Can you please tell me how to do so .I have mailed you regarding source code of demo also .Please can you send me that also .

    Thanks again.

  6. Can you please send me sample application source code or war file.

    Your help would be appreciated.

    Thanks in Advance.

    Ramana. E

  7. How can i user two displaytag in one jsp.?

    • Each displayTag table should have a unique class name. In displayTag.js file make appropriate changes [ – look at line 19 in the js file. It references the class name of the table. ]

      • Excuseme, Do you have an example for two displaytag in one jsp? I tried all but my jsp has a javascript fail when i use the second table

      • Just replied to your other post. Try what i mentioned in my email. I may not have time until mid jan to put something together.

  8. hi Vijay, Can you please send me source code for DisplayTag + JQuery = DisplayTagAjaxed.

    my mail id: anreddy4u@gmail.com

  9. @Rahul, to use two displaytag tables in one jsp you need to provide them separate “uid” otherwise sorting and exporting operation will not work properly and if you sort one table other table will automatically sorted if it contains same schema. see here for more details 10 example of displaytag in jsp

  10. Please, do you have an example for two displaytag in one jsp?
    I’ve tried everything and gives me a javascript error when I change page in the two tables, it is because we as a recursive call in this way doAjax (doAjax (…

    Thank you very much.

    • If you have more than one displaytag on your page, all you need to do is change the div id’s and edit displaytag.js file and make sure the new div id is also reflected in the code.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s

%d bloggers like this: