用JSF/DWR/DOJO创建动态Web应用(1)

为了在Javascript中使用AjaxBean，需要用 <script> 标签引入该Javascript。

DWR Java类（DWR Java类就是普通Java类。这些类不用实现任何DWR特定接口或类。）每当收到一个AJAX请求时被实例化。这意味着如果应用程序必须在AjaxBean类中维护状态，那么当新请求来临时它就被抹掉了。AjaxBean中的方法本质上被预期是无状态的，会话状态必须维护在其他地方。

AJAX请求不是一个PortletRequest，这意味着DWR Java类不用访问PortletSession对象。AJAX请求是简单的HTTP请求，因此，DWR Java类可以访问HttpSession对象。按照Portal规范，要求HttpSession和PortletSession对象应该同步，也就是说，如果一个属性被增加进PortletSession对象那么它也应被增加进HttpSession对象（不必用相同的名字）。

以JBoss AS为例，当一个管理bean被命名为someManagedBean增加进PortalSession，那么可以通过HttpSession用属性名javax.portlet.p.<portletInstanceName>?someManagedBean获得相同对象。

在本例子应用中，会话状态被维护在someManagedBean中。DWR Java类从HttpSession对象中获得someManagedBean实例并设置其属性以反映用户当前会话状态。

为了访问业务服务（比如说在Spring层），AjaxBean可以使用Service Locator模式与业务服务交互。

注意： JSF管理bean只有在接收到一个face request后才被实例化。因此确认你要用来存储会话状态的JSF管理bean已经收到了一个face request。该管理bean的作用范围应该是‘session’。

HTML模板

使用AJAX工作面临的一个问题是，基于用户动作创建复杂的HTML片段。这通常导致应用的维护成本高昂，经过一段时间，当应用需求精确了，修改用户界面有时甚至也是很困难的。HTML没有tile的概念，但是在本文例子应用了可以做一些类似tile的事情。

<table style="height: 80%; width: 100%; padding-bottom: 100px; visibility: {0};">
<tr valign="top">
<td>
<table align="left" valign="top">
<tr>
<td class="formLabel">Product Category:</td>
<td class="formField">{1}</td>
</tr>
<tr>
<td class="formLabel"><span class="required">*</span>Description:</td>
<td class="formField"><textarea rows="2" id="desc_field" cols="80" 
name="desc_field"></textarea></td>
</tr>
<table>
<tr>
<td>{dataTable}</td>
</tr>
<tr>
<td>{dataScroller}</td>
</tr>
</table>
<tr valign="bottom">
<td align="right" style="padding-right: 50px;">
<table>
<tr>
<td><input type="button" class="inputButton" onclick="saveDetails('{2}');" 
           value="Save"/></td>
</tr>
</table>
</td>
</tr>
...
...

上面HTML模板文件显示了两类占位符：

1、数据占位符（Data placeholders）
2、HTML占位符

占位符 {0}、{1} 和 {2} 代表数据占位符，很容易由如下静态方法填充：

public static String getStringWithValues(String template, Object[] values) 

  throws IncorrectNumberOfValues {
for(int i = 0; i < values.length; i++) {
int index = template.indexOf("{" + i + "}");
if(index == -1) {
throw new IncorrectNumberOfValues("The number of values passed is : " + 

    values.length + "
which doens't match the number of placeholders in : " + template);
} else {
if(values[i] != null) {
template = StringUtils.replace(template, "{" + i + "}", 

       values[i].toString());
} else {
template = StringUtils.replace(template, "{" + i + "}", "");
}
}
}
return template;
}

这里，模板是需要被解析并用值数组中的值替换占位符的html模板。因此，数据占位符{0}被值数组中的第一个元素替换，数据占位符{1}被值数组中的第二个元素替换，以此类推。

占位符 {dataTable} 和 {dataScroller}代表HTML占位符，要求被一个HTML片段替换。{dataTable} 占位符应该被数据表格所替换，该数据表格显示对应于所属某产品分类的每一个产品记录。对应于 {dataTable} 的HTML是另一个HTML模板。有两种将HTML占位符替换为相应HTLM模板的方法：

1、编程：在ajax bean内部，占位符可以被HTML替换。这种方法不需要创建任何类型的框架。
2、在properties文件或XML文档中创建占位符和HTML模板之间的映射。例如，一个properties文件可能被创建包含如下映射： {dataTable} = /WEB-INF/classes/templates/dataTableTemplate.html {dataScroller} = /WEB-INF/classes/templates/dataScroller.html

运行时这些占位符被相应模板替换。该方法要求创建一个小框架，从properties文件读取信息并解析HTML模板以使相应的HTML文件替换HTML占位符。