枫林在线论坛>>技术交流 [普通模式] [上一主题] [下一主题]
[382561] 主题: DWR让Ajax如此简单(3)
作者: little 标题:  DWR让Ajax如此简单(3)[转载]
昵称: 渺小 来自: 192.168.*.* 详细
经验值: 14348 发贴时间: 2005年12月17日 11:23:12
等级: 博大精深 长度: 3365字
http://searchwebservices.techtarget.com.cn/tips/261/2183761_2.shtml 

DWR让Ajax如此简单

【2005-11-07 14:10】【】【Matrix】

  HTML/JSP代码

  配置完成后,你就可以启动你的Web应用了,这时DWR会为从你的HTML或Java服务器

端页面(JSP)上调用所需方法作好准备,并不需要你创建JavaScript文件。在search.js
p
文件中, 我们必须增加由DWR提供的JavaScript接口,还有DWR引擎,加入以下三行到我

们的代码中:

  <script src='dwr/interface/ApartmentDAO.js'></script>
  <script src='dwr/engine.js'></script>
  <script src='dwr/util.js'></script>

  我们注意到当用户改变搜索标准时,这是Ajax在示例程序中的首次应用;正如他所看

到的,当标准改变时,可用的公寓数量被更新了。我创建了两个JavaScript函数:当某一

个选择下拉框中的值变化时被调用。ApartmentDAO.countApartments()函数是最重要的

部分。最有趣的是第一个参数, loadTotal()函数,它指明了当接收到服务端的返回时D
W
R将会调用的JavaScript方法。loadTotal于是被调用来在HTML页面的

中显示结果。下面是在这个交互场景中所使用到的JavaScript函数: 

function updateTotal() {
    $("resultTable").style.display = 'none';
    var bedrooms = document.getElementById("bedrooms").value;
    var bathrooms = document.getElementById("bathrooms").value;
    var price = document.getElementById("price").value;
    ApartmentDAO.countApartments(loadTotal, bedrooms, bathrooms, price);
}

function loadTotal(data) {
    document.getElementById("totalRecords").innerHTML = data;
}

  很明显,用户想看到符合他的搜索条件的公寓列表。那么,当用户对他的搜索标准

感到满意,并且总数也是有效的话,他会按下显示结果的按纽,这将会调用updateResu
l
ts() JavaScript方法:

function updateResults() {
    
    DWRUtil.removeAllRows("apartmentsbody");
    var bedrooms = document.getElementById("bedrooms").value;
    var bathrooms = document.getElementById("bathrooms").value;
    var price = document.getElementById("price").value;
    ApartmentDAO.findApartments(fillTable, bedrooms, bathrooms, price);
    $("resultTable").style.display = '';
}

function fillTable(apartment) {
    DWRUtil.addRows("apartmentsbody", apartment, );
}

  updateResults()方法清空了存放搜索返回结果的表域,从用户界面上获取所需参数

,并且将这些参数传给DWR创建的ApartmentDAO对象。然后数据库查询将被执行,fillT
a
ble()将会被调用,它解析了DWR返回的对象(apartment),然后将其显示到页面中(apar
t
mentsbody)。

  安全因素

  为了保持示例的简要,ApartmentDAO类尽可能的保持简单,但这样的一个类通常有

一组设置方法来操作数据,如insert(), update()和delete()。DWR暴露了所有公共方法

给所有的HTML页面调用。出于安全的原因,像这样暴露你的数据访问层是不明智的。开

发者可以创建一个门面来集中所有JavaScript函数与底层业务组件之间的通信,这样就

限制了过多暴露的功能。

  结论

  这篇文章仅仅让你在你的项目中使用由DWR支持的Ajax开了个头。DWR让你集中注意

力在如何提高你的应用的交互模型上面,消除了编写和调试JavaScript代码的负担。使

用Ajax最有趣的挑战是定义在哪里和如何提高可用性。DWR负责了操作Web页面与你的Ja
v
a对象之间的通信,这样就帮助你完全集中注意力在如何让你的应用的用户界面更加友好



  我想感谢Mircea Oancea和Marcos Pereira,他们阅读了这篇文章并给予了非常有价

值的返匮。

版权声明:Techtarget获Matrix授权发布,如需转载请联系Matrix
作者:Cloves Carneiro;simmone
原文地址:http://www.javaworld.com/javaworld/jw-06-2005/jw-0620-dwr.html 
中文地址:http://www.matrix.org.cn/resource/article/43/43926_DWR_AJAX.html 

========== * * * * * ==========
Top

| 用户注册 | 在线用户 | 投票中心 | 常见问题 |

Copyright © 2001-2012 枫林在线(www.FengLin.info) All Rights Reserved
页面运行使用42.82毫秒