IBM WebSphere Portal 7下开发支持AJAX的JSF Portlet

本文列举了几种IBM WebSphere Portal 7下开发支持AJAX的JSF Portlet的方法。 需实现的Portlet界面包括两个元素： 一个列表框和一个文本输出框，列表框包括两个选项。 列表框选项变化会触发AJAX调用以刷新文本输出框.

方法1 - 使用IBM JSF Portlet bridge 1.2和IBM JSF Extension Components

IBM WebSphere Portal 7提供支持JSF 1.2的JSF Portlet bridge 1.2， JSF 1.2本身并不提供AJAX支持， 所以需要使用IBM JSF Extension组件库来实现AJAX功能， 代码示例如下：

<%@taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
<%@taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@taglib uri="http://java.sun.com/portlet_2_0" prefix="portlet"%>
<%@taglib uri="http://www.ibm.com/jsf/html_extended" prefix="hx"%>

<%@taglib
uri="http://www.ibm.com/xmlns/prod/websphere/portal/v6.1/portlet-client-model"
prefix="portlet-client-model"%>
<%@page language="java" contentType="text/html"
pageEncoding="ISO-8859-1" session="false"%><portlet:defineObjects />
<portlet-client-model:init>
<portlet-client-model:require module="ibm.portal.xml.*" />
<portlet-client-model:require module="ibm.portal.portlet.*" />
</portlet-client-model:init>
<f:view>
<hx:scriptCollector id="scriptCollector1">
<h:form styleClass="form" id="form1">
<h:selectOneListbox id="listbox1">
<f:selectItem itemLabel="Label1"
itemValue="Value1" id="selectItem1" />
<f:selectItem itemLabel="Label2"
itemValue="Value2" id="selectItem2" />
</h:selectOneListbox>
<hx:behavior event="onchange" target="listbox1"
behaviorAction="get" targetAction="group1"></hx:behavior>
</h:form>
<h:panelGroup styleClass="panelGroup" id="group1">
<h:outputText styleClass="outputText" id="text1"
value="Hello, #{param.listbox1} "></h:outputText>
</h:panelGroup>
<hx:ajaxRefreshRequest target="group1"
id="ajaxRefreshRequest1"
params="listbox1">
</hx:ajaxRefreshRequest>
</hx:scriptCollector>
</f:view>

方法2 - 使用JSF 2.0 Portlet Bridge for IBM WebSphere Portal

IBM在Greenhouse Lotus上提供一个基于MyFaces 2.0的JSF 2.0 Portlet Bridge， 使用JSF 2.0内置AJAX支持的代码示例如下：

<div xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:portlet="http://java.sun.com/portlet_2_0"  >
<f:view>
<h:form>
<h:selectOneListbox styleClass="selectOneListbox"
id="listbox1" value="#{testBean.text}">
<f:selectItem itemLabel="Label1" itemValue="Value1"/>
<f:selectItem itemLabel="Label2" itemValue="Value2"/>
<f:ajax render="text1" execute="@this"/>
</h:selectOneListbox>
<h:outputText id="text1"
value="Hello, #{testBean.text} ">
</h:outputText>
</h:form>
</f:view>
</div>

方法3 - 使用ICEfaces Enterprise Edition (EE) 3.0

ICEfaces Enterprise Edition 3.0提供支持WebSphere Portal 7的JSF 2.0 Portlet Bridge， 并支持在MyFaces 2.0或Mojarra 2.1上运行上述方法2的代码， 但需要在portlet.xml中增加以下设置。

<container-runtime-option>
<name>javax.portlet.renderHeaders</name>
<value>true</value>
</container-runtime-option>

在WebSphere Portal 7.0.0.2和WAS 7.0.0.19下测试以上三种方法， 结果如下：

方法	Page Builder theme - SSA	Page Builder theme - CSA	Portal theme - SSA only	备注
IBM JSF Portlet bridge 1.2和IBM JSF Extension Components	正常运行	portlet可以显示， 但AJAX不工作, 没有Javascript错误	正常运行
使用JSF 2.0 Portlet Bridge for IBM WebSphere Portal (MyFaces 2.0)	正常运行	正常运行	正常运行	非官方产品， IBM不提供任何支持
ICEfaces Enterprise Edition 3.0(MyFaces 2.0/Mojarra 2.1)	正常运行	portlet无法显示， Portlet Bridge异常	portlet可以显示， 但AJAX不工作， Javascript报错	需要购买商业许可