Step by Step DWR Application – Simple AJAX in JAVA

In this article, i am going to explain the step by step approach to create the DWR (Direct Web Remoting) application in JAVA.

DWR consists of two main parts:

  • A Java Servlet running on the server that processes requests and sends responses back to the browser.
  • JavaScript running in the browser that sends requests and can dynamically update the webpage.
How DWR works in Java
How DWR works in Java

JavaScript file that must be included in your application for DWR:

1. Auto generated Javascript of your equivalent class. in this case, my java class name is “Message”, so the javascript complete path is “/<App NAME>/dwr/interface/<YOUR CLASS NAME>.js“.

in my application the path is “/SimpleDWR/dwr/interface/Message.js”

2. DWR engine file : “/<APP NAME>/dwr/engine.js”. This is responsible for marshaling of Java objects/Values between Client and Server.

3. This is not necessary, but it provides nice set of utility methods to work with HTML code :

/<APP NAME>/dwr/util.js

Lets start with our project:

Step 1: Create a Dynamic Website.
Step 2: Download and add the dwr jar files in the “web-inf/ lib” folder.
Download location : http://directwebremoting.org/dwr/downloads/index.html
Step 3: add following code in web.xml.

  <servlet>
  <servlet-name> dwr-invoker </servlet-name>
  <display-name> DWR Servlet </display-name>
  <servlet-class> org.directwebremoting.servlet.DwrServlet </servlet-class>
  <init-param>
     <param-name> debug </param-name>
     <param-value> true </param-value>
  </init-param>
</servlet>

<servlet-mapping>
  <servlet-name> dwr-invoker </servlet-name>
  <url-pattern> /dwr/* </url-pattern>
</servlet-mapping>

Step 4: create a dwr.xml alongside the web.xml and add below code:

<!DOCTYPE dwr PUBLIC
   "-//GetAhead Limited//DTD Direct Web Remoting 1.0//EN"
   "http://www.getahead.ltd.uk/dwr/dwr10.dtd">
<dwr>
<allow>
   <create creator="new" javascript="Message">
   <param name="class" value="com.G2.POJO.Message"/>
   </create>
</allow>
</dwr>

As you can see in above code, i have added the creator attribute which will tell the dwr engine to create the javascript object named “Message”, using which we can call the server side methods.

Step 5: create Java class, which will be called by the DWR javascript:

package com.G2.POJO;

public class Message {
	public String getMessage() {
		return "Hello DWR from Server";
	}
}

Step 6: create index.html with below code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>DWR Demo</title>
<script type='text/javascript' src='/SimpleDWR/dwr/interface/Message.js'></script>
<script type='text/javascript' src='/SimpleDWR/dwr/engine.js'></script>
<script type='text/javascript' src='/SimpleDWR/dwr/util.js'></script>
</head>
<body>
<input value="click me!!!" type="button" onclick="update();" />
<div style="background-color: #ffeaa7;font-weight: bold;width: 300px;" id="divResponse">
Message From Server</div>
<script type="text/javascript">
function update()
{
    Message.getMessage(function(data) {
		dwr.util.setValue("divResponse", data);
	  });
}
</script>
</body>
</html>

Start the application and Test by writing below URL:

http://localhost:8080/[YOUR-WEBAPP]/dwr/

You will see a page containing the information about class added in step 5.
Now start the application normally, and your program will run showing that how easy is AJAX with DWR.

Simple AJAX in JAVA using DWR
Simple AJAX in JAVA using DWR

Clicking on button, it will display the response coming from the java code.

You can download the war file of the examples from here and explore the DWR in depth.

Posted

in

,

by

Tags:


Related Posts

Comments

20 responses to “Step by Step DWR Application – Simple AJAX in JAVA”

  1. Ercsenyi Avatar
    Ercsenyi

    Hi Jitendra,

    Unfortunately dwr.xml is missing! Step#4 is the content of the web.xml instead of dwr.xml.

    A.

    1. Jitendra Zaa Avatar

      Thanks Ercsenyi,
      for pointing out. I have update the code.
      Regards,
      Jitendra Zaa

      1. Coolsrikkanth Avatar
        Coolsrikkanth

        hi,
           am getting an error in the console Message is not defied. can u pls help me out.

        thanks

        1.  Avatar
          Anonymous

          Hi Srikkanth,
          Can you please check the “dwr.xml” for proper settings. If you have updated the name of class or configuration then that may cause the problem.
          Regards,
          Jitendra Zaa

          1. Coolsrikkanth Avatar
            Coolsrikkanth

            Hi JitendraZaa ,

               
                   
                       
                   
               
               
               

            this is what am using in my dwr.xml still am not able find the issue.

            thanks

          2.  Avatar
            Anonymous

            Hi Srikanth,
            Javascript name is “test” in your configuration.
            Therefore in your HTML page instead of javascript file “Message.js”, you will need to import “test.js”

          3. Coolsrikkanth Avatar
            Coolsrikkanth

            Hi JitendraZaa ,
                 That has worked. Thanks for your in time reply.

  2. Coolsrikkanth Avatar
    Coolsrikkanth

    hi,
       am getting an error in the console Message is not defied. can u pls help me out.thanks

    1.  Avatar
      Anonymous

      Hi Srikkanth,
      Can you please check the “dwr.xml” for proper settings. If you have updated the name of class or configuration then that may cause the problem.
      Regards,
      Jitendra Zaa

  3. Muffy Avatar
    Muffy

    hi,

    ReferenceError: Message is not defined

    my dwr code is

    my jsp file code is

    <script type='text/javascript' src='/dwr/interface/Message.js’>

    1. Balkrushna Avatar
      Balkrushna

      just add

  4. Rupesh Mehta Avatar
    Rupesh Mehta

    Hi,
    I did everything as show above but means clicking button did not displayed “Hello DWR from Server”.
    So, I moved “” to top in the script import list.
    And, it solved the problem. Now, clicking the button displays “Hello DWR from Server” message as expected.

  5. ss Avatar
    ss

    ddfgd d dfgd

  6. Shantanoo Avatar
    Shantanoo

    Hi,
    Thanks for the information.
    I’m facing am issue in my application. It is being migrated from WAS to JBOSS. On a particular screen, when it opens, it gives a popup alert with message “Session Error”. But when I change the value of “crossDomainSessionSecurity” to false in web.xml, the alert does not comes.
    I’ve read that changing the value of “crossDomainSessionSecurity” to false will not prevent CSRF issues. What should I do ? Please suggest.
    Thanks.

  7. vinit bhardwaj Avatar
    vinit bhardwaj

    Very useful to understand DWR. Only one correction I have to do by placing DWR Servlet before dwr-invoker

    thanks a lot Jiterdra

    1. Jitendra Zaa Avatar

      Happy that it helped you

      1. vinit bhardwaj Avatar
        vinit bhardwaj

        Thank you

  8. arun saini Avatar
    arun saini

    hello sir,
    there is an exception “ClassNotFoundException: org.directwebremoting.servlet.DwrServlet”
    what will be solution for this. please tell sir.
    thank you…

  9. azzamouf Avatar
    azzamouf

    you are king

  10. karthick Avatar
    karthick

    May 21, 2018 12:58:30 PM org.directwebremoting.log.startup resolveMultipleImplementations
    INFO: Starting: Using container abstraction org.directwebremoting.server.servlet2.Servlet24ContainerAbstraction

    help me to solve this issue

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Discover more from Jitendra Zaa

Subscribe now to keep reading and get access to the full archive.

Continue Reading