dwr动态装载下拉列表框选项
今天继续学习了一点DWR的知识， 今天是用DWR实现一个简单的动态装载下拉列表框选项效果.具体程序如下：
1、java代码：获取城市和地区信息
public Map getCities(){
Map<String,String> cities=new HashMap<String,String>();
cities.put("1","天津市");
cities.put("2","北京市");
return cities;
}
public String[] getArea(String city){
ArrayList<String> area=new ArrayList<String>();
if(city.equals("1")){
area.add("和平区");
area.add("南开区");
area.add("河西区");
area.add("河北区");
}
else if(city.equals("2")){
area.add("海淀区");
area.add("朝阳区");
area.add("宣武区");
}
return area.toArray(new String[area.size()]);
}
2、在DWR中注册类方法
<?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 creator="new" javascript="DwrService">
<param name="class" value="test.DwrService"/>
</create>
</allow>
</dwr>
3、编写javascript函数访问java方法
注意需要引入：
<script type='text/javascript' src='/test/dwr/interface/DwrService.js'></script>
<script type='text/javascript' src='/test/dwr/engine.js'></script>
<script type='text/javascript' src='/test/dwr/util.js'></script>
访问函数：
function getCity(){
DwrService.getCities(function(city){
dwr.util.removeAllOptions("city");
dwr.util.addOptions("city",["请选择城市"]);
dwr.util.addOptions("city",city);});
}
function getArea(){
dwr.util.useLoadingMessage();
dwr.util.removeAllOptions("area");
var city=dwr.util.getValue("city");
DwrService.getArea(city,function(area){
dwr.util.addOptions("area",area)});
}
html页面：
<body onload="getCity()">
<h2>转换Sting[] 和Map类型数据</h2>
<br>
城市<select id="city" onchange="getArea()">
</select>
<br>
地区<select id="area"></select>
</body>