`

DWR入门教程之HelloWorld

    博客分类:
  • Ajax
阅读更多

说明:这本是林信良(良葛格)的专栏 的文章,但是受不了繁体字的折磨,改成中文了呵呵。

 

Java 开发人员与网页设计人员的桥梁 DWR… 呃!我懒得写简介了 直接来看看可以做什么吧!

请先到 http://getahead.ltd.uk/dwr/ 下载 dwr.jar ,放到 WEB-INF/lib

负责处理客户端请求,并呼叫 Java 对象的是 DWRServlet DWR 其实也有些 Model 2 的味道,只是 View 的这一层比较弱,因为放到客户端的 JavaScript 应用程序中

web.xml 中加入 DWRServlet…

<?xml version="1.0" encoding="UTF-8"?>
<web-app id="WebApp_ID" 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">
	<display-name>dwrtest</display-name>

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

		<servlet-class>org.directwebremoting.servlet.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>

</web-app>

 

接下来写个简单的 Hello 吧!

package com.dwr;

public class HelloWorld {
	private String name;
	public HelloWorld(){
		
	}
	public String getName() {
		return name;
	}
	public void setName(String name) {
		this.name = name;
	}
	public String sayHello(String name) {
        return "Hello, " + name;
    }

}
 

客户端要呼叫这个 Java 对象,传给它参数,而后传回一个字符串,客户端再显示这个字符串,神奇?其实是要告诉 DWRServlet 这件事,这需要一个 dwr.xml,在WEB-INF目录下建立这个这个文件:

<!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="JDate">
      <param name="class" value="java.util.Date"/>
    </create>
    <create creator="new" javascript="Hello">
      <param name="class" value="com.dwr.HelloWorld"/>
    </create>
  </allow>
</dwr>
creator 设定为 new ,表示使用 Hello 的无参数建构子来生成对象, javascript 设定为 Hello ,表示客户端 JavaScript 程序可以使用 Hello 来呼叫对应的 onlyfun.caterpillar.Hello 物件。

来写个客户端的网页,当中有一个输入字段,这里我们建立一个index.html,内容如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GB18030">
<title>DWR's  HelloWorld</title>
<script type='text/javascript' src='dwr/interface/Hello.js'></script>
<script type='text/javascript' src='dwr/engine.js'></script>
<script type='text/javascript' src='dwr/util.js'></script>
<script type='text/javascript' src='hello.js'></script>
</head>
<body>
<input id="user" type="text" /><input type='button' value='哈罗' onclick='hello();' />  <div id="result"></div>
</body>
</html>

 

 

dwr/interface/Hello.js 是由 DWRServlet 根据 dwr.xml 中的设定生成的, engine.js 负责客户端伺服端沟通, util.js 是一些好用的 JavaScript 程序,可以让您少写很多 JavaScript

hello.js 是我们自定义的函式,按下按钮后,会呼叫当中的 hello() 函式,因而 需要在当前文件夹下建立一个hello.js:

function hello(){
	var user = $('user').value;
	Hello.sayHello(user,callback);
}
function callback(msg){
	DWRUtil.setValue('result',msg);
}

 

${'user'} 取得输入字段的 DOM 对象, value 取得当中的域值,而后呼叫 Hello.hello() ,并将 value 当作参数传送 结果是呼叫 Server 端的 Hello Java 对象,当结果传回后,会呼叫 JavaScript callback 函式, DWRUtil setValue() 方法会将传回的 msg 设定给指定 id DOM ,结果就是 啥! AJAX 的功能在哪 就这个而言就是发出异步请求,而响应不用 Refresh 页面啦!  


 DWR HelloWorld

 

分享到:
评论
6 楼 氵壞男亼乀 2013-09-25  
我想请问下   你哪个html里面引入的几个js文件没看懂!你能不能把你的那个js的分布图截个啊!!
5 楼 bo_hai 2011-02-12  
谢谢。hello.js 可以代码一下:
function hello(){
var user = $('user').value;
Hello.sayHello(user,callback);
}

function callback(msg){

if (typeof window['DWRUtil'] == 'undefined')
    window.DWRUtil = dwr.util;
DWRUtil.setValue('result',msg);
}
4 楼 tom&jerry 2010-04-21  
引用
但是受不了繁体字的折磨,改成中文了呵呵

繁体不是中文?!
3 楼 nurenok 2009-12-22  
<create creator="new" javascript="JDate"> 
      <param name="class" value="java.util.Date"/> 
    </create> 
这个好像没用到吧
2 楼 hintcnuie 2008-05-05  
我做的是成功的,有什么出错信息么
1 楼 fangchaojun 2008-05-01  
[flash=200,200][/flash]哎,照着写了一次不成功哟!

相关推荐

    DWR入门教程之HelloWorld - 中文JAVA技术网.mht

    请先到 http://getahead.ltd.uk/dwr/ 下载 dwr.jar ,放到 WEB-INF/lib 下 … 负责处理客户端请求,并呼叫 Java 对象的是 DWRServlet , DWR 其实也有些 Model 2 的味道,只是 View 的这一层比较弱,因为放到客户端...

    DWR入门 helloworld源码

    DWR的初学者,初次配置时你们一定会遇到很多问题,所以一个很好的helloworld源码,一定对大家有所帮助。MyEclipse7.0测试,绝对运行

    HelloWorld-Dwr

    关于dwr的入门示例:helloworld。详细介绍了dwr的使用方法。

    DWR的环境搭建与第一个入门程序HelloWorld

    近日工作中用到DWR,前段时间研究了一下,过段时间没有接触再入手发现有点生疏,于是今天我就打算在温习一下。本文档实用与新手,主要是DWR的环境搭建与第一个入门程序HelloWorld

    dwr的helloworld入门例子

    dwr基础入门例子。非常简单,便于入门。

    dwr框架入门程序

    dwr框架学习,入门hello world程序。

    dwr入门demo

    这个是dwr的demo 自己写的 不怎么好 但是入门做helloworld 的好帮手

    好资料 学习资料DWR

    DWR入门学习和深一步学习的好资料 里面有HelloWorld,也有DWR使用技巧

    dwr中文文档pdf(附dwr购物车实例源代码)

    中文,dwr入门的好资料,也可做参考资料,有web.xml,dwr.xml的详细配置和说明 ,engine.js,util.js功能介绍,异常处理...等等 ,有最简单的helloworld入门例子,也有dwr购物车范例精讲 ,提供源代码 , 真的很不错...

    DWR中文文档.pdf

    DWR入门 8 1.1 简介 8 1.2 第一个DWR程序:Hello World 9 1.2.1 将DWR放入你的工程 9 1.2.2 编辑配置文件 9 1.2.3 编写service 10 1.2.4 测试DWR 10 1.2.5 编写一个jsp 11 1.3 本...

    Jetty中文手册

    这个wiki提供jetty的入门教程、基础配置、功能特性、优化、安全、JavaEE、监控、常见问题、故障排除帮助等等。它包含教程、使用手册、视频、特征描述、参考资料以及常见问题。 Jetty文档 ---------------- 入门...

    EXT2.0中文教程

    1.7. 入门之前,都看helloworld。 1.7.1. 直接使用下载的发布包 1.7.2. 只把必要的东西放进项目中 2. 震撼吧!让你知道ext表格控件的厉害。 2.1. 功能丰富,无人能出其右 2.2. 让我们搞一个grid出来耍耍吧。 2.3. ...

    EXT教程EXT用大量的实例演示Ext实例

    1.7. 入门之前,都看helloworld。 1.7.1. 直接使用下载的发布包 1.7.2. 只把必要的东西放进项目中 2. 震撼吧!让你知道ext表格控件的厉害。 2.1. 功能丰富,无人能出其右 2.2. 让我们搞一个grid出来耍耍吧。 ...

    iuhyiuhkjh908u0980

    Buildfile: G:\eclipseEjb3\Ejb_HelloWorld_02\build.xmlprepare: [mkdir] Created dir: G:\eclipseEjb3\Ejb_HelloWorld_02\buildcompile: [javac] Compiling 3 source files t ... by caizhongda 2009-02-28 回复 ...

    Ext 开发指南 学习资料

    1.6. 入门之前,都看helloworld。 1.6.1. 直接使用下载的发布包 1.6.2. 只把必要的东西放进项目中 2. 震撼吧!让你知道ext表格控件的厉害。 2.1. 功能丰富,无人能出其右 2.2. 让我们搞一个grid出来耍耍吧。 2.3. ...

    精通JS脚本之ExtJS框架.part2.rar

    3.2.3 编写HelloWorld.html 3.2.4 运行调试ExtJS 3.3 辅助开发 3.3.1 调试工具Firebug 3.3.2 开发利器Spket 第4章 ExtJS事件机制 4.1 设计模式——观察者模式 4.2 自定义事件 4.3 浏览器事件 4.4 ExtJS中的...

    精通JS脚本之ExtJS框架.part1.rar

    3.2.3 编写HelloWorld.html 3.2.4 运行调试ExtJS 3.3 辅助开发 3.3.1 调试工具Firebug 3.3.2 开发利器Spket 第4章 ExtJS事件机制 4.1 设计模式——观察者模式 4.2 自定义事件 4.3 浏览器事件 4.4 ExtJS中的...

Global site tag (gtag.js) - Google Analytics