实战dwr

实战dwr

dwr的准备工作：取得dwr的dwr.jar包和其他dwr所需的其他jar包这里不作介绍了。

本实例所要介绍的是采用dwr来操作页面表单table，发送各种（带有参数包括简单类型，list,map类型）请求，并返回各种信息（包括普通的javabean，java.util.List，java.util.Map信息）,下面是源代码

web.xml

<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>false</param-value>

       </init-param>

       <init-param>

           <param-name>logLevel</param-name>

           <param-value>WARN</param-value>

       </init-param>

</servlet>

<servlet-mapping>

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

       <url-pattern>/dwr/*</url-pattern>

</servlet-mapping>

dwr.xml

<dwr>

    <allow>

       <create creator="new" javascript="DealerMonitor">

           <param name="class"

              value="com.vstsoft.dataimport.dto.Monitor" />

       </create>

       <convert converter="bean"

           match="com.vstsoft.dataimport.dto.Dealer" />

    </allow>

    <signatures>

       <![CDATA[

       import java.util.List;

       import java.util.Map;

       import com.vstsoft.dataimport.dto.Monitor;

       import com.vstsoft.dataimport.dto.Dealer;

       Monitor.setDealers(List<Dealer>);

       Monitor.setDealersMap(Map<String,Dealer>);

       ]]>

    </signatures>

</dwr>

Dealer.java

package com.vstsoft.dataimport.dto;

 

public class Dealer {

    private String sid = "";

 

    private String name = "";

 

    private String info = "";

 

    private String level = "";

 

    private String[] product;

 

    public String getInfo() {

       return info;

    }

 

    public void setInfo(String info) {

       this.info = info;

    }

 

    public String getLevel() {

       return level;

    }

 

    public void setLevel(String level) {

       this.level = level;

    }

 

    public String getName() {

       return name;

    }

 

    public void setName(String name) {

       this.name = name;

    }

 

    public String[] getProduct() {

       return product;

    }

 

    public void setProduct(String[] product) {

       this.product = product;

    }

 

    public String getSid() {

       return sid;

    }

 

    public void setSid(String sid) {

       this.sid = sid;

    }

}

Monitor.java

package com.vstsoft.dataimport.dto;

 

import java.util.ArrayList;

import java.util.HashMap;

import java.util.Iterator;

import java.util.List;

import java.util.Map;

import java.util.Set;

 

import org.apache.commons.logging.Log;

import org.apache.commons.logging.LogFactory;

 

/**

 * author:sunjianbin <br>

 * email:volcano_hosan@sina.com

 */

public class Monitor {

    private static Log log = LogFactory.getLog(Monitor.class);

 

    /**

     * param:String,String return:java.util.List

     * information:dwr调用服务器端类的带有简单参数的方法<br>

     * 返回java.util.List信息

     */

    public List getDealers(String name, String level) {

       log.info("name:" + name + ",level:" + level);

       List list = new ArrayList();

       Dealer dealer = new Dealer();

       dealer.setName("海尔");

       dealer.setInfo("青岛海尔");

       dealer.setLevel("1");

       dealer.setSid("0532001");

       list.add(dealer);

       Dealer dealer2 = new Dealer();

       dealer2.setName("海信");

       dealer2.setInfo("青岛海信");

       dealer2.setLevel("2");

       dealer2.setSid("0532002");

       list.add(dealer2);

       log.info("list size:" + list.size());

       return list;

    }

 

    /**

     * param:String,String return:java.util.List

     * information:dwr调用服务器端类的带有简单参数的方法<br>

     * 返回一个javaBean信息

     */

    public Dealer getDealer(String name, String level) {

       log.info("经销商名称:" + name + ",经销商级别:" + level);

       Dealer dealer = new Dealer();

       dealer.setName("海尔");

       dealer.setInfo("青岛海尔");

       dealer.setLevel("1");

       dealer.setSid("0532001");

       return dealer;

    }

 

    /**

     * param:String,String return:java.util.List

     * information:dwr调用服务器端类的带有简单参数的方法<br>

     * 返回java.util.Map信息

     */

    public Map getDealersMap(String name, String level) {

       log.info("经销商名称:" + name + ",经销商级别:" + level);

       Map map = new HashMap();

       Dealer dealer = new Dealer();

       dealer.setName("海军第一舰队");

       dealer.setInfo("总司令肖光");

       dealer.setLevel("1");

       dealer.setSid("6106335");

       map.put("key1", dealer);

       Dealer dealer2 = new Dealer();

       dealer2.setName("空军航空大队");

       dealer2.setInfo("统帅杨勇");

       dealer2.setLevel("2");

       dealer2.setSid("388949596");

       map.put("key2", dealer2);

       log.info("map 的大小：" + map.size());

       return map;

    }

 

    /**

     * param:java.util.List return:java.util.List

     * information:dwr调用服务器端类的带有java.util.List参数的方法<br>

     * 返回java.util.List信息

     */

    public List setDealers(List dealers) {

       List list = new ArrayList();

       if (dealers != null) {

           for (int i = 0; i < dealers.size(); i++) {

              Dealer dealer = (Dealer) dealers.get(i);

              log.info("经销商名称：" + dealer.getName() + "，经销商详细信息："

                     + dealer.getInfo());

              list.add(dealer);

           }

       }

       return list;

    }

 

    /**

     * param:java.util.Map return:java.util.Map

     * information:dwr调用服务器端类的带有java.util.Map参数的方法<br>

     * 返回java.util.Map信息

     */

    public Map setDealersMap(Map dealers) {

       Map map = new HashMap();

       if (dealers != null) {

           Set set = dealers.keySet();

           Iterator it = set.iterator();

           while (it.hasNext()) {

              String key = (String) it.next();

              log.info("key:" + key);

              Dealer dealer = (Dealer) dealers.get(key);

              log.info("经销商名称：" + dealer.getName() + "，经销商详细信息："

                     + dealer.getInfo());

              map.put(key, dealer);

           }

       }

       return map;

    }

}

test.jsp

<%@ page contentType="text/html;charset=GBK" language="java" %>

<html>

    <head>

        <title>dwr功能演示</title>

       <script src='dwr/interface/DealerMonitor.js'> </script>

        <script src='dwr/engine.js'> </script>

        <script src='dwr/util.js'> </script>

    </head>

<SCRIPT language=javascript>

//采用dwr的util.js的DWRUtil得到表单值

function getValue(){

    var name=DWRUtil.getValue("name");

    var info=DWRUtil.getValue("info");

    var product=DWRUtil.getValue("product");

    var level=DWRUtil.getValue("level");

    var sid=DWRUtil.getValue("sid");

    var text=DWRUtil.getText("level");

    var product2=$("product");

    //alert("产品："+product2.value);

    if(level=="-1"){

       alert("请选择经销商级别");

       return false;

    }

    alert("经销商名称："+name+"，经销商详细信息："+info+"，经销商经销产品："+product+"经销商级别："+text+"，经销商级别(参数)："+level+"，隐藏id值："+sid);

    var dealer={name:null,info:null,product:null,level:null,sid:null};

    var params=DWRUtil.getValues(dealer);

    alert(params);

    alert("经销商名称："+dealer.name+"，经销商详细信息："+dealer.info+"，经销商经销产品："+dealer.product+"经销商级别："+dealer.level+"，隐藏id值："+dealer.sid);

}

//从服务器端得到javabean信息

function getValueFormServer(){

    var name=DWRUtil.getValue("name");

    var level=DWRUtil.getValue("level");

    //带有简单参数，回调函数为setValueFromServer

    DealerMonitor.getDealer(setValueFromServer,name,level);

}

function setValueFromServer(dealer){

    alert(dealer.name);

    DWRUtil.removeAllRows("table4");

    //把javabean的信息组装成一个简单的数组，然后显示到页面上

    var array=[{"sid":dealer.sid,"name":dealer.name,"info":dealer.info,"level":dealer.level}];

    DWRUtil.addRows("table4",array,[function(item){return item.sid},function(item){return item.name},function(item){return item.info},function(item){return item.level}]);

}

//从服务器端得到java.util.List类型的信息

function getListValuesFormServer(){

    var name=DWRUtil.getValue("name");

    var level=DWRUtil.getValue("level");

    //带有简单参数，回调函数为setListValuesFromServer

    DealerMonitor.getDealers(setListValuesFromServer,name,level);

}

function setListValuesFromServer(dealers){

    //关于取得java.util.List里面的对象的方法

    for(var i=0;i<dealers.length;i++){

       alert("经销商名称："+dealers[i].name);

    }

    DWRUtil.removeAllRows("table4");

    DWRUtil.addRows("table4",dealers,[function(item){return item.sid},function(item){return item.name},function(item){return item.info},function(item){return item.level}]);

}

//从服务器端得到java.util.Map类型的信息

function getMapValuesFormServer(){

    var name=DWRUtil.getValue("name");

    var level=DWRUtil.getValue("level");

    //带有简单参数，回调函数为setListValuesFromServer

    DealerMonitor.getDealersMap(setMapValuesFromServer,name,level);

}

function setMapValuesFromServer(dealers){

    //关于取得java.util.Map里面的对象的方法

    for(var property in dealers){

       var bean = dealers[property];

       alert(bean.name);

    }

    DWRUtil.removeAllRows("table4");

    DWRUtil.addRows("table4",dealers,[function(item){return dealers[item].name},function(item){return dealers[item].name},function(item){return dealers[item].info},function(item){return dealers[item].level}]);

}

//通过dwr来对一个对象{}来设置其值列表

function setValues(){

    DWRUtil.setValues({name:"上海华联",info:"上海华联商场",product:"2",sid:"1380001",level:"2"});

}

//通过dwr简单的对一个input来设置其值

function setValue(){

    DWRUtil.setValue("name","联合利华");

    DWRUtil.setValue("info","上海黄埔区");

    DWRUtil.setValue("product","2");

    DWRUtil.setValue("sid","021-7862392738");

    DWRUtil.setValue("level","1");

}

//采用dwr来操作select

function deldwrselect(){

    DWRUtil.removeAllOptions("dwrselect");

    var cctv=[{"name":"中央一套","value":"cctv1"},{"name":"中央二套","value":"cctv2"},{"name":"中央三套","value":"cctv3"}];

    DWRUtil.addOptions("dwrselect",cctv,"value","name");

    DWRUtil.setValue("dwrselect", "cctv3");

    var value=DWRUtil.getValue("dwrselect");

    //dwr的DWRUtil.getText仅用于对select的操作

    var text=DWRUtil.getText("dwrselect");

    alert("value:"+value+",text:"+text);

}

//采用dwr来操作table里面的行和列，要采用<tbody>

function deldwrtable(){

    DWRUtil.removeAllRows("table4");

    var items=[{"name":"中国","net":"www.cctv.com.cn","city":"北京"},{"name":"北京","net":"sunjianbin.blog.hexun.com","city":"北京"}];

    DWRUtil.addRows("table4",items,[function(item){return item.name},function(item){return item.net},function(item){return item.city}]);

    //DWRUtil.addRows("table4",['sun','jian','bin'],[function(item){return item;},function(item){return item.toUpperCase();}]);

}

//向服务器发送List的信息

function sendListValueToServer(){

    var dealer={name:null,info:null,product:null,level:null,sid:null};

    DWRUtil.getValues(dealer);

    dealers = [{ name:"中华人民共和国",info:"国务院" ,sid:"01031889296",level:"1"},dealer];

    DealerMonitor.setDealers(setListValuesFromServer,dealers);

}

//向服务器发送Map信息

function sendMapValueToServer(){

    var dealer={name:null,info:null,product:null,level:null,sid:null};

    DWRUtil.getValues(dealer);

    dealers = { "key1":{ name:"中华人民共和国",info:"国务院" ,sid:"01031889296",level:"1"}, "key2":dealer};

    DealerMonitor.setDealersMap(setMapValuesFromServer,dealers);

}

</SCRIPT>

<body>

<table width="75%" border="0" align="center" cellpadding="1" cellspacing="1">

  <tr align="center">

    <td colspan="4">采用DWR得到页面表单信息</td>

  </tr>

  <tr>

    <td width="22%" align="right">经销商名称</td>

    <td colspan="3" align="left"> <input name="name" type="text" id="name" value="国美家电"></td>

  </tr>

  <tr>

    <td align="right">经销商详细信息</td>

    <td colspan="3" align="left"> <textarea name="info" id="info">北京国美</textarea></td>

  </tr>

  <tr>

    <td align="right">经销产品</td>

    <td width="25%" align="left"> <input name="product" type="checkbox" id="product" value="1"></td>

    <td width="28%" align="left"> <input name="product" type="checkbox" id="product" value="2"></td>

    <td width="25%" align="left"> <input name="product" type="checkbox" id="product" value="3"></td>

  </tr>

  <tr>

    <td align="right">行业级别</td>

    <td colspan="3" align="left"> <select name="level" id="level">

        <option value="-1" selected>-选择-</option>

        <option value="0">总代理</option>

        <option value="1">一级代理</option>

        <option value="2">二级代理</option>

      </select></td>

  </tr>

  <tr align="center">

    <td colspan="4"> <input name="sid" type="hidden" id="sid" value="123456789">

      <input type="button" name="Submit" value="提交经销商信息" onClick="getValue()">

      <input type="button" name="Submit3" value="批量重设经销商信息" onClick="setValues()">

      <input type="button" name="Submit32" value="逐个重设经销商信息" onClick="setValue()">

    </td>

  </tr>

  <tr align="center">

    <td colspan="4">

<input type="button" name="Submit323" value="往服务器发回List经销商信息" onClick="sendListValueToServer()">

      <input type="button" name="Submit3232" value="往服务器发回Map经销商信息" onClick="sendMapValueToServer()"></td>

  </tr>

</table>

<hr>

<table width="75%" border="0" align="center" cellpadding="1" cellspacing="1">

  <tr align="center">

    <td colspan="3">采用DWR操作select</td>

  </tr>

  <tr>

    <td colspan="3" align="center"> <select name="dwrselect" id="dwrselect">

        <option value="-1" selected>-选择-</option>

        <option value="0">总代理</option>

        <option value="1">一级代理</option>

        <option value="2">二级代理</option>

      </select> </td>

  </tr>

  <tr>

    <td>&nbsp;</td>

    <td>&nbsp;</td>

    <td>&nbsp;</td>

  </tr>

  <tr align="center">

    <td colspan="3">

      <input type="button" name="Submit2" value="dwr删除select列表信息" onClick="deldwrselect()">

    </td>

  </tr>

</table>

<hr>

<table width="75%" border="0" align="center" cellpadding="1" cellspacing="1">

  <tr align="center">

    <td width="100%">采用DWR来操作表Table</td>

  </tr>

</table>

<table width="75%" border="0" align="center" cellpadding="1" cellspacing="1">

  <tr align="center">

    <td width="16%">序号</td>

    <td width="53%">名称</td>

    <td width="31%">行业级别</td>

  </tr>

</table>

<table width="75%" border="0" align="center" cellpadding="1" cellspacing="1">

  <tbody id="table4">

    <tr align="center">

      <td width="16%">1</td>

      <td width="53%">北京国美</td>

      <td width="31%">总代理</td>

    </tr>

    <tr align="center">

      <td>2</td>

      <td>上海联华</td>

      <td>一级代理</td>

    </tr>

    <tr align="center">

      <td>3</td>

      <td>联合利华</td>

      <td>二级代理</td>

    </tr>

  </tbody>

</table>

<table width="75%" border="0" align="center" cellpadding="1" cellspacing="1">

  <tr align="center">

    <td width="100%"><input name="butt" type="button" id="butt" onClick="deldwrtable()" value="dwr删除table所有行">

      <input type="button" name="Submit322" value="从服务器List得到经销商列表信息" onClick="getListValuesFormServer()">

      <input type="button" name="Submit3222" value="从服务器得到单个经销商信息" onClick="getValueFormServer()"></td>

  </tr>

  <tr align="center">

    <td><input type="button" name="Submit3223" value="从服务器Map得到经销商列表信息" onClick="getMapValuesFormServer()"></td>

  </tr>

</table>

<p>&nbsp;</p>

</body>

</html>

采用dwr+strutsaction开发文件上传进度条在我的博客里有其他文章介绍

采用dwr+spring开发数据库级的文章后续会逐渐添加