DWR 实现三级联动-优快云博客

dwr：direct web remoting 是我们通过javascript方便的操作业务方法。我以一个三级联动下拉框的例子给大家演示dwr是如何实现的。我用到的技术有spring 2.0.5 ，dwr2.0.5，hibernate3.2.3.ga,struts1.2.9，主要涉及到dwr如何调用spring管理的业务方法，以及dwr如何处理返回的数据。

dwr的配置：

Code

<servlet-name>dwr-invoker</servlet-name>

<servlet-class>uk.ltd.getahead.dwr.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>

我要实现的是地区，市县，社区的三级下拉，比如邯郸地区，邯郸县，明珠社区，这样的下拉框，数据库表设计是这样的：

id name pid

1 邯郸 0

2 邯郸县 1

3 明珠社区 2

.....

大家一看都明白了吧。

那么如何实现呢？第一个下了框显示地区，数据可以从action或者servlet中去，也可以用dwr来去，我采取第二种方式。

html代码：

Code

function initCity()

{

var cityObj = document.getElementById('city');

var areaObj = document.getElementById('area');

var street = document.getElementById('street');

cityObj.options[0] = new Option('请选择','-1');

areaObj.options[0] = new Option('请选择','-1');

street.options[0] = new Option('请选择','-1');

cityService.getBaseCities(cb);

function cb(cities)

{

for(var i=0;i<cities.length;i++)

{

cityObj.options[cityObj.options.length] =

new Option(cities[i].name,cities[i].id);

}

</script>

城市：

注意 cityService.getBaseCities(cb); 这行代码 cityService 是dwr暴漏给javascript的对象，用它可以操作业务方法。它是怎么设置的呢？实际上我们CityService是我们业务方法，代码如下

Code

public interface ICityService

{

public List getBaseCities();

}

public class CityServiceImpl implements ICityService

{

CityDao cityDao;

public List getBaseCities()

{

return cityDao.getBaseCities();

}

那么javascript如何才能调用getBaseCities()方法，来填充第一个下拉框呢？

好，dwr一个重要的配置文件上演了。

dwr.xml

Code

<?xml version="1.0" encoding="UTF-8"?>

<!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 2.0//EN" "http://getahead.org/dwr/dwr20.dtd">

<dwr>

<allow>

</create>

</allow>

</dwr>

allow节点下面的create 有一个属性 creator="spring" 代表我们要暴漏的服务端代码是从spring中来的。param的beanName代表根据spring配置文件配置的id来取bean，哪个bean呢? value="cityService"，就是cityService这个bean. 看一下spring配置文件

Code