远程 Java 对象方法和对应的 JavaScript 存根函数之间的映射很简单。通用的形式是JavaScriptName.methodName(methodParams ..., callBack),其中 JavaScriptName 是 creator 的javascript 属性指定的名称,methodParams 代表 Java 方法的 n 个参数,callback 是要用 Java 方法的返回值调用的 JavaScript 函数。如果熟悉 Ajax,可以看出这个回调机制是 XMLHttpRequest 异步性的常用方式。
在示例场景中,我用清单 3 中的 JavaScript 函数执行搜索,并用搜索结果更新用户界面。这个清单还使用来自 DWR 的 util.js 的便捷函数。要特别说明的是名为 $() 的 JavaScript 函数,可以把它当作document.getElementById() 的加速版。录入它当然更容易。如果您使用过 JavaScript 原型库,应当熟悉这个函数。
清单 3. 从客户机调用远程的 findItems()
在上面的 searchFormSubmitHandler() 函数中,我们感兴趣的代码当然是 catalog.findItems(searchexp, displayItems);。这一行代码就是通过网络向 DWR servlet 发送 XMLHttpRequest 并用远程对象的响应调用 displayItems() 函数所需要的全部内容。
displayItems() 回调本身是由一个 Item 数组表示调用的。这个数组传递给 DWRUtil.addRows() 便捷函数,同时还有要填充的表的 ID 和一个函数数组。表中每行有多少单元格,这个数组中就有多少个函数。按照顺序使用来自数组的 Item 逐个调用每个函数,并用返回的内容填充对应的单元格。
在这个示例中,我想让商品表中的每一行都显示商品的名称、说明和价格,并在最后一列显示商品的 Add to Cart 按钮。清单 4 显示了实现这一功能的单元格函数数组:
清单 4. 填充商品表的单元格函数数组
前三个函数只是返回 dwr.xml 中 Item 的 convertor 包含的字段内容。最后一个函数创建一个按钮,把Item 的 ID 赋给它,并指定在点击按钮时应当调用名为 addToCartButtonHandler 的函数。这个函数是第二个用例的入口点:向购物车中添加 Item。