Rss Feeds

Article Topics

All Articles

General AJAX

ASP.NET AJAX

Google Web Toolkit

AJAX Using Java

AJAX Using PHP

Dojo

articles >> general ajax >> AjaxTags Tutorial (Part 1)

AjaxTags Tutorial (Part 1)

By : Mamun Zaman
Jul 08, 2007

Printer friendly

AjaxTags Part-1

In my previous articles, Using Ajax with PHP and Using Ajax with Java Technologies, I tried to discuss the JavaScript code segment required for sending Asynchronous HTTP requests and getting responses. AjaxTags is an open source project that provides JSP tags for developing Ajax based web applications in Java technologies without adding JavaScript codes in your JSP pages. In short, AjaxTags is a set of JSP tags that simplify the use of Asynchronous JavaScript and XML (AJAX) technology in Java Server Pages.

Installing AjaxTags:

In this article we will try to use AjaxTags in JSP pages, but first we need to install AjaxTags.
To use the tag library, you'll need the following:
1. JDK 1.5+
2. Servlet container running Servlets 2.3+ and JSP 1.0+: I’ll use Tomcat server.
3. Download and copy Prototype (prototype.js) from http://www.prototypejs.org/assets/2007/6/20/prototype.js , currently AjaxTags depends upon version 1.5.0
4. Download and copy Scriptaculous library from http://script.aculo.us/dist/scriptaculous-js-1.7.0.zip , currently AjaxTags depends upon version 1.7.0
5. Download and copy OverLIBMWS library from http://www.macridesweb.com/oltest/overlibmws.zip

Note: AjaxTags distribution also includes JavaScript files, CSS files and other libraries.

After downloading the binary distribution of AjaxTags, you need to extract the compressed (.zip) file and copy the ajaxtags-1.3.jar in your WEB-INF/lib directory. This distribution also has a .tld file (tag library) named ajaxtags.tld. For JSP 1.x, you need to copy this tag library also in WEB-INF directory. Also you need to add entries in web.xml configuration file for this tag libraries. You need to specify the URI and location of this TLD in your web.xml. Here is a sample configuration for this (considering the TLD is in WEB-INF directory),

<taglib>
<uri>http://ajaxtags.org/tags/ajax</uri>
<location>/WEB-INF/ajaxtags.tld</location>
</taglib>

You need to add this URI in your JSP files if you want to use AjaxTags tag library.

Using AjaxTags in JSP:

If you want to use AjaxTags tag library in your JSP page, then first thing you need to do is add the tag library like below example.

<%@ taglib uri="http://ajaxtags.org/tags/ajax" prefix="ajax" %>

You now have the JARs and TLDs copied and included in JSP. Now you need the JavaScript sources for using AJAX. Make a folder in your web directory and copy all the necessary JavaScripts there. You need following javaScript files.
1. prototype.js
2. scriptaculous.js
3. overlibmws.js
4. overlibmws_crossframe.js
5. overlibmws_iframe.js
6. overlibmws_hide.js
7. overlibmws_shadow.js
8. ajaxtags.js

Ajaxtags.js is our main source and this is dependent upon the above javaScript files (1-7). It is suggested to add them before ajaxtags.js. You must also include prototype.js before ajaxtags.js. It is better to include these libraries between <head> and </head> tags.

Here we assume that the js folder is in the context root. You can download these scripts from the links I provided at the beginning.

You now need stylesheets ,some are part of the AjaxTags package. Include them in the head section. Use the following codes.

I normally make a folder for these stylesheets called css in web directory where my JSP pages are. If you think these styles are not enough for you then you can always modify them or add new styles.

We now have everything in place to make use of AjaxTags. You need to develop the server side codes that you want to request using AJAX. The server side part can be any servlets or JSP or any other non-java applications. AjaxTags will display the server side responses correctly as long as they are the proper format AjaxTags specified. The proper XML format is –

<?xml version="1.0" encoding="UTF-8"?>
<ajax-response>
<response>
<item>
<name>Record 1</name>
<value>1</value>
</item>
<item>
<name>Record 2</name>
<value>2</value>
</item>
<item>
<name>Record 3</name>
<value>3</value>
</item>
</response>
</ajax-response>

This is server response of AJAX request. AjaxTags is capable of parsing this XML to get the values. Remember the XML elements here. If you have a PHP that can generate similar output, then you can make request for that PHP (or any server side script that generates a similar response) using AjaxTags from JSP. AjaxTags has XML parser to parse this XML. AjaxTags also supports HTML contents and strings also. Different tags require different responses.

Next Page>>