A dwr example : Fast Address Entry

When you tab out of the "postcode" field the browser calls the onchange event, which calls the fillAddress() function:

function fillAddress() ... {
varpostcode=dwr.util.getValue("postcode");
AddressLookup.fillAddress(postcode,function(address)...{
dwr.util.setValues(address);
});
}

This code first gets the contents of the postcode field, and then performs a call to the server using this postcode.

When the server replies we fill the values into the form using the setValues() function.

On the server, we could have created a JavaBean to hold the address data but for this example we have just used a java.util.Map. We could change to using a JavaBean without any JavaScript changes so long as the Map keys have the same names as the JavaBean properties.

public MapfillAddress(Stringorigpostcode)
... {
Mapreply=newHashMap();
Stringpostcode=LocalUtil.replace(origpostcode,"","");

if(postcode.equalsIgnoreCase("LE167TR"))
...{
reply.put(LINE2,"ChurchLane");
reply.put(LINE3,"ThorpeLangton");
reply.put(LINE4,"MARKETHARBOROUGH");
}
...
else
...{
reply.put(LINE2,"Postcodenotfound");
reply.put(LINE3,"");
reply.put(LINE4,"");
}

returnreply;
}

HTML source:

< table >
< tr >
< td > Zipcode/Postcode: </ td >
< td >< input id ="postcode" type ="text" onchange ="fillAddress()" /></ td >
</ tr >
< tr >
< td > Housename/number: </ td >
< td >< input id ="house" type ="text" /></ td >
</ tr >
< tr >
< td > Line2: </ td >
< td >< input id ="line2" type ="text" /></ td >
</ tr >
< tr >
< td > Line3: </ td >
< td >< input id ="line3" type ="text" /></ td >
</ tr >
< tr >
< td > Line4: </ td >
< td >< input id ="line4" type ="text" /></ td >
</ tr >
</ table >

Javascript source:

function fillAddress() ... {
varpostcode=dwr.util.getValue("postcode");
AddressLookup.fillAddress(postcode,function(address)...{
dwr.util.setValues(address);
});
}

Java source:

package org.getahead.dwrdemo.address;

import java.util.HashMap;
import java.util.Map;

import org.directwebremoting.util.LocalUtil;

public class AddressLookup
... {
privatestaticfinalStringLINE4="line4";

privatestaticfinalStringLINE3="line3";

privatestaticfinalStringLINE2="line2";

publicMapfillAddress(Stringorigpostcode)
...{
Mapreply=newHashMap();
Stringpostcode=LocalUtil.replace(origpostcode,"","");

if(postcode.equalsIgnoreCase("LE167TR"))
...{
reply.put(LINE2,"ChurchLane");
reply.put(LINE3,"ThorpeLangton");
reply.put(LINE4,"MARKETHARBOROUGH");
}
elseif(postcode.equalsIgnoreCase("NR147SL"))
...{
reply.put(LINE2,"RectoryLane");
reply.put(LINE3,"Poringland");
reply.put(LINE4,"NORWICH");
}
elseif(postcode.equalsIgnoreCase("B927TT"))
...{
reply.put(LINE2,"OltonMere");
reply.put(LINE3,"WarwickRoad");
reply.put(LINE4,"SOLIHULL");
}
elseif(postcode.equalsIgnoreCase("E178YT"))
...{
reply.put(LINE2,"");
reply.put(LINE3,"POBox43108");
reply.put(LINE4,"LONDON");
}
elseif(postcode.equalsIgnoreCase("SN48QS"))
...{
reply.put(LINE2,"Binknoll");
reply.put(LINE3,"WoottonBassett");
reply.put(LINE4,"SWINDON");
}
elseif(postcode.equalsIgnoreCase("NN57HT"))
...{
reply.put(LINE2,"Heathville");
reply.put(LINE3,"");
reply.put(LINE4,"NORTHAMPTON");
}
else
...{
reply.put(LINE2,"Postcodenotfound");
reply.put(LINE3,"");
reply.put(LINE4,"");
}

returnreply;
}
}

dwr.xml

<? xmlversion="1.0"encoding="UTF-8" ?>
<! DOCTYPEdwrPUBLIC
"-//GetAheadLimited//DTDDirectWebRemoting2.0//EN"
"http://getahead.org/dwr/dwr20.dtd" >

< dwr >
< allow >
< create creator ="new" javascript ="AddressLookup" >
< param name ="class" value ="org.getahead.dwrdemo.address.AddressLookup" />
</ create >
</ allow >
</ dwr >