dwr3.0的HELLOWORLD创建过程

arpenker

浏览: 364863 次
性别:
来自: 广州

最近访客更多访客>>

xujianxie

guojch

唯-我-独-尊

wangyy

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

DWR JSP Web Gmail JavaScript

淘二哥女装专业导购
http://www.tao2ge.com

//arpenker@gmail.com
//http://www.jiqishu.com
2009-06-09

大概流程:1.web工程导包.2.建立javabean.3.用url检查你的类是否可用.4.在页面中引用http://localhost:8080/aaaa/dwr/这个页面里指写的js文件.再加上你的JS.再加上你的button.

这个URL是查看DWR的方法 http://localhost:8080/[YOUR-WEBAPP]/dwr/

新建WEB工程.导入DWR3.0的那个JAR包.
导入log4j所需要的包..(用DEMO里的LIB,全导进去好了.)

首先创建一个WEB应用程序工程. 接下来将dwr的包导入.

开始写个javabean吧.须有构造函数.
然后写dwr配置文件.指定三个地方.你写的类并指定它的路径.你对这个类赋于js对象的称呼.你是新建的方式. 指定该对象的生命周期.

接下来.我们在web.xml中配置servlet启动dwr工程.

我们进行测试http://localhost:8080/dwrTest/dwr/ (dwrTest是你的项目名,套上去就可以了.其它不变)
进入后发现一个链接.点击进去,看到我们写的方法.如getMyName()这个方法,那就ok了.表示我们配置和BEAN都写对了.如果没有就再检查.还有我们引用的LIB库是否OK.

然后我们进入默认的index.jsp页面.组装并调用这些已经写好的东西.
我们的可以把回调ajax写在index.jsp里.也可以把这个鬼回调写到单独的一个文件里.引入进来就可以了.
但是这个INDEX.JSP.如果要使用DWR完成回调.还需要把三个js文件导进来才行.
1.dwr/engine.js   2.dwr/util.js 3.interface/MyTest.js   这三个js文件.前两个是dwr包里的.<script type= ... src=..../>类似这样写的.
后一个是执行http://localhost:8080/dwrTest/dwr这个URL.点击上面的链接后,进入就可以看到需要引入三个URL的提示,下面显示的是可以测试的类和函数.....

2.定义一个sayHello的JS函数.这是个回调函数哦.

3.写上你的网页内容.如:显示姓名.然后触发sayHello();

发现已知产生过的错误:

1.<script language="javascript">
    function sayHello(){

          MyTest.getMyName(function(data){
   dwr.util.setValue("demo1",data);

});
}

解惑:这段js的根本目的就是要通过sayHello这个函数产生一个回调并将结果输出到demo1这个层上.

     这里产生的困惑主要有:a. function 拼写错误..呵呵..这个是个人原因吧.JS写的不够多.
                                b. MyTest.getMyName这是个什么东西? 这个MyTest不过是dwr.xml中那个javascript="MyTest"对它的定义.它的意思无非是说javascript调用时的对象名称.在这里指定一下.
                                c.function(data){
                                     dwr.util.setValue("demo1",data);
                                   }
                             这里是dwr包里定义的一个函数.它指定了把data输出到哪个标签上.当然.这个函数可以随便换的.也可以用任何JS语法表达.不一定非得吊死在DWR的的函数里.用innerHTML也可以的呀.
                                d.<input 里定义一个触发事件.然后由事件绑定到sayHello()函数.

2.配置文件: dwr.xml里面定义了的是什么??它和web.xml有关联吗?
                    a. 首先在web.xml里需要定义一个servlet用来启动一个dwr的主程序.
                    b.然后在dwr.xml里需要定义的是需要让dwr创建的方法和类.以及js对象该用的名称.
                    c.貌似还可以指定你的对象的生命周期.scope操作区域.application.


3.最后一部就是我们的BEAN了..
       一定要用JAVABEAN的方式创建.很多时候我们忽视了这一块.导致程序无法正常使用.
        JAVABEAN的有一个空的构造函数.这就对了.呵呵.
          然后再写别的方法.

源文件
com.arpenker.Test
package com.arpenker;

public class Test {

public Test(){
}

public String getMyName(){
        return "hangzhou--arpenker";
    }

}

dwr.xml和web.xml放一块啊.
<?xml version="1.0" encoding="UTF-8"?>
<!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="MyTest" scope="application">
<param name="class" value="com.arpenker.Test"/>
</create>
</allow>
</dwr>

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>
      <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.jsp</welcome-file>
</welcome-file-list>
</web-app>

index.jsp
<%@ page language="java" contentType="text/html; charset=GB18030"
pageEncoding="GB18030"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GB18030">
<title>DWR - Test Home</title>

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

<script language="javascript">
    function sayHello(){

    MyTest.getMyName(function(data){

    dwr.util.setValue("demo1",data);
    });

    }


</script>
</head>
<body>
    <h1>arpenker dwr3.0 helloworld 精讲.</h1>
    <input type="button" value="显示姓名" onclick="sayHello()"/>

    <div id="demo1" ></div>

</body>
</html>

还有几个包.dwr.jar log*****.jar把官方dwr3下载后里面有.实例里面那些包全加进来就行了.

有什么疑问?
//arpenker@gmail.com
//http://www.jiqishu.com

dwr30Helloworld.pdf (93.3 KB)
下载次数: 58

1
顶

0
踩

分享到：

EXT 2.2 的HELLO WORD 创建详程 | 如何在flexviewer增加widget

2009-06-12 02:00
浏览 2936
评论(1)
分类:Web前端
查看更多

1 楼心愿 2012-03-06

index.jsp应该建立在哪个目录下

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论