专栏首页源哥的专栏DWR让Ajax如此简单(2)

DWR让Ajax如此简单(2)

DWR让Ajax如此简单(2)

http://www.51cto.com 2005-11-18 17:18 作者:Cloves Carneiro;simmone 出处:www.javaworld.com

调试页 现在你必须让DWR知道通过XMLHttpRequest对象,什么对象将会接收请求。这个任务由叫做dwr.xml的配置文件来完成。在配置文件中,定义了DWR允许你从网页中调用的对象。从设计上讲,DWR允许访问所有公布类的公共方法,但在我们的例子中,我们只允许访问几个方法。下面是我们示例的配置文件: <dwr><allow><convert converter="bean" match="dwr.sample.Apartment"/><create creator="new" javascript="ApartmentDAO" class="dwr.sample.ApartmentDAO"><include method="findApartments"/><include method="countApartments"/></create></allow></dwr> 上面的文件实现了我们例子中的两个目标。首先,<convert>标记告诉DWR将dwr.sample.Apartment对象的类型转换为联合数组,因为,出于安全的原因,DWR默认的不会转换普通bean。第二,<create>标记让DWR暴露出dwr.sample.ApartmentDAO类给JavaScript调用;我们在页面中使用JavaScript文件被javascript属性定义。我们必须注意<include>标记,它指明了dwr.sample.ApartmentDAO类的哪些方法可用。 HTML/JSP代码 配置完成后,你就可以启动你的Web应用了,这时DWR会为从你的HTML或Java服务器端页面(JSP)上调用所需方法作好准备,并不需要你创建JavaScript文件。在search.jsp文件中, 我们必须增加由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()函数,它指明了当接收到服务端的返回时DWR将会调用的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;} 很明显,用户想看到符合他的搜索条件的公寓列表。那么,当用户对他的搜索标准感到满意,并且总数也是有效的话,他会按下显示结果的按纽,这将会调用updateResults() 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, [ getId, getAddress, getBedrooms, getBathrooms, getPrice ]);} updateResults()方法清空了存放搜索返回结果的表域,从用户界面上获取所需参数,并且将这些参数传给DWR创建的ApartmentDAO对象。然后数据库查询将被执行,fillTable()将会被调用,它解析了DWR返回的对象(apartment),然后将其显示到页面中(apartmentsbody)。 安全因素 为了保持示例的简要,ApartmentDAO类尽可能的保持简单,但这样的一个类通常有一组设置方法来操作数据,如insert(), update()和delete()。DWR暴露了所有公共方法给所有的HTML页面调用。出于安全的原因,像这样暴露你的数据访问层是不明智的。开发者可以创建一个门面来集中所有JavaScript函数与底层业务组件之间的通信,这样就限制了过多暴露的功能。 结论 这篇文章仅仅让你在你的项目中使用由DWR支持的Ajax开了个头。DWR让你集中注意力在如何提高你的应用的交互模型上面,消除了编写和调试JavaScript代码的负担。使用Ajax最有趣的挑战是定义在哪里和如何提高可用性。DWR负责了操作Web页面与你的Java对象之间的通信,这样就帮助你完全集中注意力在如何让你的应用的用户界面更加友好。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • DWR让Ajax如此简单(1)

    阅读提示:这篇文章让读者看到了一个使用了DWR的Web应用是如何一步步建立的。我会展示创建这个简单的示例应用的必要的细节,这个应用是可下载的并且可以在你的环境...

    源哥
  • 挖掘dwr

    精巧的设计使DWR很容易被java开发人员接受;对传统web程序的无侵害性让它被引入更多的项目。与服务器端通信,DWR很有代表性,并很好的隐藏的xm...

    源哥
  • 在DWR中实现直接获取一个JAVA类的返回值

        DWR是Ajax的一个开源框架,可以很方便是实现调用远程Java类。但是,DWR只能采用回调函数的方法,在回调函数中获取返回值,然后进行处理。那么,到底...

    源哥
  • Ajax技术全解(3)

    传统的表单提交,在文本框输入内容后,点击按钮,后台处理完毕后,页面刷新,再回头检查是否刷新结果正确。使用Ajax,在点击sunmit按钮后,立刻进行异步处理,并...

    py3study
  • ajax 开源项目 DWR

    ajax开源项目dwr的使用: 利用DWR可以在客户端利用JavaScript直接调用服务端的Java方法并返回值 给JavaScript就好像直接本地客户端调...

    源哥
  • 经典的20道AJAX

    1、什么是AJAX,为什么要使用Ajax(请谈一下你对Ajax的认识) 什么是ajax: AJAX是“Asynchronous JavaScript and X...

    企鹅号小编
  • 分析DWR util.js包

    ajax是一种提高web站点吸引力和实用性的书写web页面的方法。它从服务器端更新web页面的特殊区域,从而增强用户的交互性。它允许信息在短时间的延迟或不用...

    源哥
  • AJAX实践DWR篇

    DWR(Direct Web Remoting)是一个WEB远程调用框架.利用这个框架可以让AJAX开发变得很简单.利用DWR可以在客户端利用JavaScrip...

    源哥
  • DWR文档之 技巧和要点

    这里列出了在使用DWR时候的一些技巧和要点,希望对你有所帮助。请对你有过帮助的地方添加评论…

    源哥

扫码关注云+社区

领取腾讯云代金券