Featured White Papers

• Measuring Risk to Improve Java Software Quality
• Do You Really Get Classloaders?
• Pragmatic Continuous Delivery with Jenkins, Nexus, and LiveRebel
• Your Next Java Web App: Less XML, No Long Restarts, Fewer Hassles
• Coding with JRebel, Java Forever Changed
• 2012 Developer Productivity Report: Java Tools, Tech, Devs, and Data

Sponsored Links

• Graph databases are 1000x faster than relational.

  Learn More!

• Career opportunities at Harman- Careers That'll Rock Your Socks Off.

  Learn More!

• Developer-friendly Java PDF libraries by Qoppa Software

  Live Demos

• Stop blaming your app! Diagnose Java performance issues.

  Free tool >

• UrbanCode: Go From Continuous Integration to
  Continuous Delivery

  Learn More!

Sponsored Links

Optimize with a SATA RAID Storage Solution
Range of capacities as low as $1250 per TB. Ideal if you currently rely on servers/disks/JBODs

AJAX made simple with DWR

Start using AJAX in your Web application with DWR

By Cloves Carneiro Jr., JavaWorld.com, 06/20/05

AJAX, or Asynchronous JavaScript and XML, describes a Web development technique for creating interactive Web applications using a combination of HTML (or XHTML) and Cascading Style Sheets for presenting information; Document Object Model (DOM); JavaScript, to dynamically display and interact with the information presented; and the XMLHttpRequest object to interchange and manipulate data asynchronously with the Web server.

Many examples on the Internet show all the necessary steps for using XMLHttpRequest to communicate with the server from within an HTML file. When manually writing and maintaining the XMLHttpRequest code, a developer must deal with many potential problems, especially with cross-browser compatibilities like different DOM implementations. This can lead to countless hours spent coding and debugging JavaScript code, which is not known to be developer friendly.

The DWR (Direct Web Remoting) project is an open source solution under the Apache license for the developer who wants to use AJAX and XMLHttpRequest in an easy way. It has a set of JavaScript functions that remove the complexity from calling methods in a Java object running on the application server from the HTML page. It handles parameters of different types and helps keep the HTML code readable.

DWR is not intrusive to one's design, as it does not force any sort of inheritance architecture for objects to be exposed. It fits well in any application that runs in a servlet framework. For the less DHTML-experienced developers, DWR also provides a JavaScript library to help with frequently used DHTML tasks, like populating tables, filling select boxes with items, and changing the content of HTML elements such as <div> and <span>.

The DWR Website is comprehensive and has a fair amount of documentation, which has served as a foundation for this article. Some examples are provided to demonstrate how DWR can be used and what can be accomplished with the library.

This article allows the user to see a step-by-step creation of a Web application that uses DWR. I show you all the details necessary to create the sample application, which you'll be able to download and deploy in your environment to evaluate how DWR works.

Note: Finding information about AJAX is not difficult; several articles and blog entries on the Web cover the subject, each of which tries to identify and comment about a different aspect of the concept. In Resources, you will find some interesting links to examples and articles to learn more about AJAX.

Sample application

The example application used in this article simulates an apartment rental search engine for the city of Toronto. The user can select a set of search criteria before performing the search. To improve interaction, AJAX is used in two occasions:

• The application notifies the user of the number of search results that match his selection. This number is updated—using AJAX—as the user selects the amount of desired bedrooms and bathrooms, and the price range. By showing the user the number of results, the user won't need to hit the search button when no results or too many results match the user's criteria.
• The database query that retrieves the units from the database is performed using AJAX. The database search executes when the user presses the Show Results button. Thus, the application seems more responsive, as the whole page doesn't need to be reloaded to show the results.

Database

The database we use is HSQL, a Java SQL database engine with a small footprint, which can be bundled with the Web application with no additional installation and configuration. A SQL file is used to create the in-memory table and add some records when the Web application context is started.