JSF 2 简介: 后来添加的 Ajax 复合组件
2010-07-13 00:00:00 来源:WEB开发网清单 4 中的图标组件声明一个 image 属性和一个名为 link 的 actionSource。该 actionSource 在 清单 1 中用作 <f:actionListener> 的 for 属性的值。如果还不太明白,您可以查看 “JSF 2 简介,第 2 部分:模板及复合组件” 了解动作源如何处理复合组件,其中简短讨论了一个与 清单 4 中类似的图标实现。
清单 4 中的图标组件实现允许页面作者配置图标的外观和行为,但不允许作者将 Ajax 行为附加到组件。完成实现之后,如果用户单击一个图像,JSF 会提交整个页面,在收到返回值时完全重新绘制该页面。
现在您将看到如何让页面作者将 Ajax 添加到图标组件。
使用 <composite:clientBehavior> 添加 Ajax 支持
为了让页面作者能够将 Ajax 添加到 <util:icon> 组件内的链接,我使用 <composite:clientBehavior> 标记,如清单 5 所示:
清单 5. <util:icon 复合组件,版本 2
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:composite="http://java.sun.com/jsf/composite">
<composite:interface>
<composite:attribute name="image" required="true"/>
<composite:actionSource name="link" targets="#{cc.clientId}:iconForm:link"/>
<composite:clientBehavior name="click"
event="action"
targets="#{cc.clientId}:iconForm:link"/>
</composite:interface>
<composite:implementation>
<div id="#{cc.clientId}">
<h:form id="iconForm">
<h:commandLink id="link" immediate="true">
<h:graphicImage value="#{cc.attrs.image}"/>
</h:commandLink>
</h:form>
</div>
</composite:implementation>
</html>
更多精彩
赞助商链接