DWR二级菜单级联

来源：互联网发布：win7 ie修复软件编辑：程序博客网时间：2024/05/17 05:52

index.html

<html>
<script src="/dwrajax/dwr/interface/ItemsBean.js"></script>
<script src="/dwrajax/dwr/engine.js"></script>
<script src="/dwrajax/dwr/util.js"></script>
<script language="javascript">
function update1()
{
ItemsBean.ClassList(createList1);
}
function createList1(data)
{
DWRUtil.removeAllOptions("classid");
DWRUtil.addOptions("classid", data);
}
function update2()
{
ItemsBean.UserList(createList2,DWRUtil.getValue("classid"));
}
function createList2(data)
{
DWRUtil.removeAllOptions("userid");
DWRUtil.addOptions("userid", data);
}
</script>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>班级和学生Ajax级联下拉菜单</title>
</head>
<body onload="update1()">
<form name="formform">
班级<select name="classid" id="classid" onchange="javascript:update2();"></select>
学生<select name="userid" id="userid"></select>
</form>
</body>
</html>

ItemsBean.java

package org.baiyun;
import java.util.*;
/**
*
* @author baiyun
*/
public class ItemsBean {
private String[] class1 = {"同学1","同学2","同学3","同学4","同学5","同学6"};
private String[] class2 = {"同学7","同学8","同学9","同学10"};
private String[] class3 = {"同学11","同学12","同学13","同学14","同学15","同学16","同学17"};
private String[] class4 = {"同学18","同学19","同学20"};
private String[] class5 = {"同学21","同学22","同学23","同学24","同学25","同学26"};
/** Creates a new instance of ItemsBean */
public ItemsBean() {
}
public Map ClassList() {
Map reply = new LinkedHashMap();
reply.put("0", "所有");
reply.put("1", "班级1");
reply.put("2", "班级2");
reply.put("3", "班级3");
reply.put("4", "班级4");
reply.put("5", "班级5");
return reply;
}
public Map UserList(String CLASSID) {
Map reply = new LinkedHashMap();
reply.put("0", "所有");
// 这里用数组模拟数据库查询结果。
// 真实环境中，你只要将数据库查询结果放入到reply里面就可以了。
// reply的id就是返回后下拉框的option的value，reply的value就是返回后下拉框的option的text。
// 如: sql = "select * from users where classid=?";
if(CLASSID==null || CLASSID.equals("") || CLASSID.equals("0")){
//
}else if(CLASSID.equals("1")){
int id =1;
for(int i=0;i<class1.length;i++){
reply.put(""+id, class1[i]);
id++;
}
}else if(CLASSID.equals("2")){
int id =1;
for(int i=0;i<class2.length;i++){
reply.put(""+id, class2[i]);
id++;
}
}else if(CLASSID.equals("3")){
int id =1;
for(int i=0;i<class3.length;i++){
reply.put(""+id, class3[i]);
id++;
}
}else if(CLASSID.equals("4")){
int id =1;
for(int i=0;i<class4.length;i++){
reply.put(""+id, class4[i]);
id++;
}
}else if(CLASSID.equals("5")){
int id =1;
for(int i=0;i<class5.length;i++){
reply.put(""+id, class5[i]);
id++;
}
}
return reply;
}
}

web.xml

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE web-app PUBLIC "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN" "http://java.sun.com/dtd/web-app_2_3.dtd">
<web-app>
<servlet>
<servlet-name>dwr-invoker</servlet-name>
<display-name>DWR Servlet</display-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>
<welcome-file-list>
<welcome-file>index.htm</welcome-file>
</welcome-file-list>
</web-app>

dwr.xml: 是让js和java直接通讯，很神奇吧~ 这就是dwr的贡献。

<?xml version="1.0" encoding="gbk"?>
<!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="ItemsBean">
<param name="class" value="org.baiyun.ItemsBean"/>
</create>
</allow>
</dwr>