`
wwwzhouhui
  • 浏览: 361103 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

dwr 实现2级联动

阅读更多

 

整理了一下之前写的一写代码,之前写的DWR 实现下拉控件的2级联动

1. DWR 使用

    DWR使用很简单下载dwr.jar包,配置WEB.xml

 

<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.4" 
	xmlns="http://java.sun.com/xml/ns/j2ee" 
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
	xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee 
	http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd">
	<servlet>
        <servlet-name>dwr-invoker</servlet-name>    
        <servlet-class>org.directwebremoting.servlet.DwrServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>dwr-invoker</servlet-name>
        <url-pattern>/dwr/*</url-pattern>
    </servlet-mapping>
</web-app>

    看了WEB.XML 其实就是发布一个DWR实现的一个Servlet。

 2.配置dwr.xml

   其实DWR就是将后台的JAVA 代码暴露出一个JS。这样我们前台就直接可以操控后台代码了。JAVA 怎么转换成JS这个任务就交给DWR来完成我们就不用关心了

   一个很简答的dwr.xml文件描述

 

<?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>
    <!-- address -->
    <create creator="new" javascript="test2">
      <param name="class" value="ddd.test2"/>
    </create>
 
  </allow>

</dwr>

   这里说明一下,create creator="new"是用Java的new关键字创造对象

 

  creator属性 是必须的 - 它用来指定使用那种创造器。

   默认情况下DWR1.1有8种创造器。它们是:

  • new : 用Java的new关键字创造对象。
  • none : 它不创建对象,看下面的原因。 (v1.1+)
  • scripted : 通过BSF使用脚本语言创建对象,例如BeanShell或Groovy。
  • spring : 通过Spring框架访问Bean。
  • jsf : 使用JSF的Bean。 (v1.1+)
  • struts : 使用Struts的FormBean。 (v1.1+)
  • pageflow : 访问Beehive或Weblogic的PageFlo                           

      javascript="test2" 是你需要将xx.jAVA 暴露出test2.js名称,后面调用时候引用这个JS

      value=""是你的类路径

     这样就暴露出 test2.java 成 Tetst2.js 了

3.验证DWR是否发布成功

   启动TOMCAT 发布应用http://localhost:8083/dfdf/dwr/util.js,http://localhost:8083/dfdf/dwr/engine.js,

   http://localhost:8083/dfdf/dwr/interface/test2.js

   8083是我的TOMCAT 端口 dfdf是我的项目名称.在IE地址栏中分别输入上面三个连接地址。会显示出对应的代码

   这个就说么你的DWR 发布成功

   其中util.js 和engine.js 是DWR 默认生成的JS ,test2.js是我么之前部署dwr.xml 指定某一个JAVA 暴露出的JS

4.dwr 实现2级联动实现

   编写测试JSP

 

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<%@page import="ddd.test" %>
<script type='text/javascript' src='/dfdf/dwr/engine.js'> </script>
<script type='text/javascript' src='/dfdf/dwr/util.js'> </script>
<script type='text/javascript' src='/dfdf/dwr/interface/test2.js'> </script>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'MyJsp.jsp' starting page</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->

  </head>
  
  <body>
    This is my JSP page. <br>
    
    <select name='onlineUser' onchange="update(this.selectedIndex)">
    <option  id ="online" value="">所有</option>
    <% test S = new test();
     List list =S.getlist();
     for (int i=0;i<list.size();i++){
    	 
    %>
    <option value='<%=i %>'><%=list.get(i).toString() %></option>
    <%} %>
    </select>
    
    <select id='onlineUser2'>
    <option  id ="online" value="">所有</option>
    </select>
  </body>
</html>
<script type="text/javascript">
<!--

//-->
  function update(value){
  	 test2.getlist(value, function(message) {
  	 		document.getElementById('onlineUser2').options.length=0;
  	 		for ( var i=0;i<message.length;i++){
  	 			var   option   =   document.createElement("option");
  	 					option.value=i;
  	 					option.text=message[i];
  	 					
  	 			document.getElementById('onlineUser2').options.add(option);
  	 		}
  	 		
         })
  }
  
</script>

    其中

<script type='text/javascript' src='/dfdf/dwr/engine.js'> </script>
<script type='text/javascript' src='/dfdf/dwr/util.js'> </script>
<script type='text/javascript' src='/dfdf/dwr/interface/test2.js'> </script>

这3端JS 要引入,才能使用DWR   dfdf 是我的项目名称dwr/engine.js 和dwr/util.js 指定的相关路径

自定义的test2.js DWR默认会放在dwr/interface/ 目录结构中

 后台代码test2.java

package ddd;

import java.util.ArrayList;
import java.util.List;

/**
 * @author 周辉 E-mail:zhouhui@baoz.com.cn
 * @version 创建时间:2008-8-28 下午09:12:17
 * 类说明
 */

public class test2 {
	
	
	public  List getlist(String  status){
		List  cityList = new ArrayList();
		 int status1 = Integer.parseInt(status);
		switch(status1)
        {
           
            case 1:
                cityList.add("合肥");
                cityList.add("芜湖");
                cityList.add("淮南");
                break;
           
            case 2:
                cityList.add("南京");
                cityList.add("苏州");
                cityList.add("镇江");
                break;
            
            case 3:
                cityList.add("普陀");
                cityList.add("宝山");
                cityList.add("黄埔");
                break;
        }
		return cityList;
	}

}

   5 发布代码测试

    将项目发布tomcat 就是可以实现了

    IE 中运行http://localhost:8083/dfdf/MyJsp.jsp

    显示效果

   


 下来第一个COMBOX  右边第2个变动



 相关的代码见附件

  • 大小: 4.9 KB
  • 大小: 3.8 KB
分享到:
评论
1 楼 wushuang5156 2011-11-13  
恩例子很简单 也很方便。

相关推荐

    ajax dwr 框架实现二级联动下拉列表源码

    **Ajax DWR 框架实现二级联动下拉列表源码详解** Ajax(Asynchronous JavaScript and XML)是一种在无需刷新整个网页的情况下,能够更新部分网页的技术。DWR(Direct Web Remoting)则是一个用于Java web应用的开源...

    dwr实现四级联动(五级参数信息展示)

    总的来说,"dwr实现的四级联动"是一个结合了前端动态交互和后端数据处理的典型应用场景,它要求开发者具备良好的JavaScript基础、DWR使用经验,以及对服务器端数据操作的理解。通过实践这样的项目,开发者可以提升...

    DWR 实现三级联动(2)

    【DWR实现三级联动(2)】的知识点详解 DWR (Direct Web Remoting) 是一个JavaScript库,它允许Web应用程序直接与Java后端进行交互,实现Ajax功能,即在不刷新整个页面的情况下更新部分网页内容。在这个场景中,DWR...

    dynamic.rar dwr实现两级联动

    在“dynamic.rar”这个压缩包中,我们可能找到了一个关于使用DWR实现两级联动的例子。两级联动通常指的是在一个下拉列表的选择会影响另一个下拉列表的选项,这种交互常见于省市区选择、产品分类等场景。 DWR的核心...

    DWR实现三级联动.pdf

    ### DWR实现省市县三级联动的关键技术点 #### 一、DWR简介及应用场景 - **DWR**(Direct Web Remoting)是一种简化Ajax应用程序开发的框架,它使得客户端JavaScript可以直接调用服务器端的Java方法变得简单易行。在...

    纯JSP+DWR实现三级联动下拉选择菜单 实现无刷新联动 DWR判断用户是否存在 ajax二级联动菜单 DWR操作数据库模拟实现Google搜索效果

    本示例主要展示了如何使用纯JSP和Direct Web Remoting (DWR)技术来构建一个功能丰富的用户界面,其中包括三级联动下拉选择菜单、无刷新联动、用户存在性判断以及模拟Google搜索效果的功能。DWR是一种JavaScript库,...

    DWR 实现三级联动(1)

    总结来说,DWR提供了一个强大而简便的机制,使得在Struts2这样的MVC框架中实现三级联动下拉菜单成为可能,提高了Web应用的交互性和响应性。通过合理配置和编程,我们可以创建出高效且用户友好的Web界面。

    dwr框架实现二级菜单联动

    在IT领域的开发中,利用DWR(Direct Web Remoting)框架结合Ajax技术实现二级菜单的联动,是一项常见的功能需求,尤其是在动态网页应用中。本文将深入解析如何在包含Spring、Hibernate、Ajax、DWR等技术栈的项目中,...

    DWR实现省市县三级联动小例子

    标题 "DWR实现省市县三级联动小例子" 暗示了这个压缩包可能包含一个使用Direct Web Remoting (DWR) 技术构建的示例项目,该示例展示了如何实现在网页上进行省、市、县三级联动选择的功能。这种功能在很多中国的网站...

    ajax与dwr实现二级联动

    在实现二级联动的过程中,首先我们需要一个包含父级选项的数据集,当用户在父级选择器中选择一个选项时,AJAX 调用被触发。这个调用通过DWR发送到服务器,服务器根据选定的父级值查询相应的子级数据。查询完成后,...

    SSH+dwr实现三级级联动-转自Ajava

    SSH+dWR实现三级联动是一种常见的Web开发技术,用于构建动态、交互性强的Web应用程序。SSH是Spring、Struts和Hibernate三个开源框架的缩写,它们分别负责应用的依赖注入、MVC模式和对象关系映射。DWR(Direct Web ...

    ssh+dwr2实现省市二级联动

    总的来说,SSH+DWR实现省市二级联动涉及后端数据获取、前端交互和异步通信等多个方面。通过合理配置和编程,可以创建出高效、响应式的Web应用。对于初学者,这是一项很好的实践项目,有助于理解和掌握Java Web开发的...

    ajaxdwr select二级联动

    现在,让我们深入探讨如何使用Ajax和DWR实现select二级联动: 1. **前端准备**:首先,你需要两个HTML的`&lt;select&gt;`元素,一个代表一级分类,另一个代表二级分类。通常,一级分类的选择会触发二级分类的更新。使用...

    DWR实现省市县三级联动

    DWR不仅简化了服务器端和客户端之间的通信,还提供了很多方便的特性,比如自动将Java数据类型转换为JavaScript数据类型,支持JSON协议,以及对各种Java对象类型的支持等,这些都是DWR在实现省市县三级联动中的核心...

    spring+hibernate+dwr+mysql实现二级联动

    ajax,spring,hibernate,dwr,实现二级联动

    DWR实现的三级联动链表的例子

    在这个“DWR实现的三级联动链表的例子”中,我们将探讨如何使用DWR创建一个能够动态更新的三级联动列表,这种功能常见于如地区选择、产品分类等场景。 首先,我们需要理解DWR的基本工作原理。DWR通过在浏览器端创建...

    纯JSP+DWR实现三级联动下拉选择菜单实现技巧

    总的来说,纯JSP+DWR实现三级联动下拉选择菜单是一个相对轻量级且高效的解决方案,它避免了大型框架带来的复杂性,仅使用必要的组件实现了动态数据更新。这种方法对于学习和理解AJAX通信、DWR工作原理以及如何在JSP...

    Struts2+Spring+Hibernate+DWR实现的城市联动

    在这个"Struts2+Spring+Hibernate+DWR实现的城市联动"项目中,我们将深入探讨这四个框架如何协同工作,以及它们在实现动态数据交互中的关键作用。 首先,Struts2是一个基于MVC(Model-View-Controller)设计模式的...

Global site tag (gtag.js) - Google Analytics