DWR introduction

Thursday, December 30, 2010 Posted by Jagadeesh Manne
What is DWR?
• Is a Java and JavaScript open source library which
allows you to write Ajax web applications
> Hides low-level XMLHttpRequest handling
• Specifically designed with Java technology in mind
> “Easy AJAX for Java”
• Allows JavaScript code in a browser to use Java
methods running on a web server just as if they
were in the browser
> Why it is called “Direct remoting”

Why DWR?
• Without DWR, you would have to create many
Web application endpoints (servlets) that need to
be address'able via URI's
• What happens if you have several methods in a
class on the server that you want to invoke from
the browser?
> Each of these methods need to be addressable via URI
whether you are using XMLHttpRequest directory or clientside
only toolkit such as Dojo or Prototype
> You would have to map parameters and return values to
HTML input form parameters and responses yourself
• DWR comes with some JavaScript utility functions

  • create a web application using netbeans
  • download dwr.jar files and include them in your web-inf/lib folder. you can find these jar files in my example
  • edit web.xml to include dwr servlet 
  • create dwr.xml file to convert java class to javascript class
  • create jsp page 
  • create java class
  • call java class method using converted javascript class in jsp page
  • now execute this applicaton
 when i am doing this example i faced one problem to include those jar files in our application. i copied jar files to tomcat server lib and i executed this example.nothing happens.using google chrome inspect element i found those engine.js and util.js files not included. i have done small mistake that is instead of including dwr.jar files in web-inf/lib i included them in tomcat/lib.to find this problem i dont have net connection in home. and i dont have friends to know about dwr. after struggling one hour i removed jar files from tomcat lib and included them in web-inf/lib. why i am saying this no one cant do this mistake again. in next post i will write code about this example. you can find information about that example in comments of that code itself. if you like my explanation follow my blog.and if you have any suggestions and doubts please post your comments in blog comment form below that post. thanks and we will meet in next post  

based on my example what i observed is using dwr we can convert java class to javascript class. using this javascript class we can call java class methods in client side itself.

Creating JavaClass:

package mypack;
public class MyJavaClass
public String getMessage()
return "Wow! First DWr Example Success.hello from " +
"Jagadeesh using server" ;
//we will call this method
//in client side using javascript class

Configuring DWR servlet in web.xml
here we are giving url path to dwr servlet. if you exctract dwr.jar files you can find that class in uk.ltd.getahead.dwr folder. if i learn more about dwr i will explain about this in later examples.if you know more about this xml file please post your comment below then other people can learn that

creating dwr.xml to convert java class to javascript class:
<create creator="new" javascript="MyJavaScriptClass">
<!-- here MyJavaScriptClass is dynamic javascript class generated by dwr-->
<param name="class" value="mypack.MyJavaClass"/>
<!-- now dwrservlet convert mypack.MyJavaClass to MyJavaScriptClass.
so we can call methods of mypack.MyJavaClass using MyJavaScritpClass-->

here we are converting java class to javascript class using creator.so we can call javaclass methods using this javascript class.

Creating jsp page for frontend:
Document   : index
Created on : Dec 30, 2010, 9:37:30 PM
Author     : Jagadeesh
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Dwr Example</title>
<!-- You have to include these two JavaScript files from DWR -->
<script type='text/javascript' src='dwr/engine.js'></script>
<script type='text/javascript' src='dwr/util.js'></script>
<!-- This JavaScript file is generated specifically for your application -->
<!-- in dwr.xml we have converted MyJavaClass to MyJavaScriptClass.js-->
<!-- so we can call java class methods using this javascript class-->
<script type='text/javascript' src='dwr/interface/MyJavaScriptClass.js'>
function getMessageFromServer()
//getMessage is a method in java class. we can call this method
//using our generated javascript class
//handleReceivedData is a call back method
function handleReceivedData(str)
<body onload="getMessageFromServer()">

you can read above comments to understand this concept.we have to include engine.js and util.js files and we have to include our generated javascript class using dwr.xml.that is present in dwr/interface folder.
<script type='text/javascript' src='dwr/engine.js'></script> 
<script type='text/javascript' src='dwr/util.js'></script>
<script type='text/javascript' src='dwr/interface/MyJavaScriptClass.js'> </script>

now execute this example and you will get message from server. if you have any doubts post your comments

Download DWR example with source 

To execute open with netbeans and run index.jsp
Labels: , ,
  1. Nice and Simple example of DWR......

  2. Thanks. for latest updates visit my new blog

    i will post springs,hibernate video tutorials soon

Post a Comment