我要投搞

标签云

收藏小站

爱尚经典语录、名言、句子、散文、日志、唯美图片

当前位置:九肖六肖三肖全年资料 > 取标记组件 >

后来添加的 Ajax 复合组件

归档日期:06-06       文本归类:取标记组件      文章编辑:爱尚语录

  developerWorks 中国 正在向 IBM Developer 过渡。 我们将为您呈现一个全新的界面和更新的主题领域,并一如既往地提供您希望获得的精彩内容。

  JSF 2 简介系列是 David Geary 的三篇同名简介文章的后续系列,将像一位功夫大师一样帮助您开发和提升您的 JSF 2 框架技能。本系列将深入探究 JSF 2 及其生态系统,同时还将介绍如何将一些 Java EE 技术,如 Contexts 和 Dependency Injection,与 JSF 相集成。

  在JSF 2 简介系列的上一期中,我讨论了使用内置的 Ajax 实现自动完成复合组件。页面作者可以在一个 facelet 中使用该组件,该组件负责处理所有 Ajax 细节。尽管内置的 Ajax 已经存在,但仍然可以在开发人员实现复合组件之后(可能是很长一段时间以后),方便地让页面作者将 Ajax 添加到该组件中。本文将展示复合组件如何容纳后来添加的 Ajax。

  但是, JSF 2 的f:ajax标记不会处理复合组件(确实如此),因为复合组件只是组件容器。

  例如,在 “JSF 2 简介,第 2 部分:模板及复合组件” 中,我介绍了一个简单的图标复合组件,它包含一个链接,由一幅图像表示。当用户单击该图标时,该链接提交一个表单,后者触发一个与图标链接相关联的服务器端动作侦听器。使用图标很简单:

  因为您可以使用f:ajax标记将提交按钮转变为 Ajax 按钮,您可能认为您能够对图标执行相同操作:

  上面的代码片段不会生效,因为我向图标组件附加了f:ajax标记,我真正想要做的是将它附加到图标内部的链接上。

  在本例中,我需要的是一种允许我将 Ajax 行为附加到图标内部的链接的机制,或者更一般地,允许我将 Ajax 行为附加到复合组件内部的组件。这种机制(在 Mojarra 和 Apache MyFaces 中实现过,而在 JSF 2.0 中完全没有记录)是本文讨论的重点。(注意:在编写本文时已添加了 MyFaces 支持。)在了解该机制的工作原理之前,我将创建一个新的图标复合组件供使用。

  本系列的代码基于 JSF 2,在一个企业容器中运行,比如 GlassFish 或 Resin。参见 “JSF 2 简介:Ajax 组件”,获取使用 GlassFish 安装和运行本系列代码的分步教程。参见下载部分获取本文的示例代码。

  想象一下您拥有一项全世界最酷的工作。也许您正在实现新一代魔兽世界图形引擎。但遗憾的是,这只是个梦想。今天,您要实现的是如图 1 所示的字体选择程序:

  您的上司问您实现此选择程序将需要多长时间。他们用户能够单击 2 字符预览窗口中的 + 和 - 图标来更改字体大小。当然,他们希望使用 Ajax,以便预览窗口和图标旁边显示的大小会自动更新,而无需对页面的其余部分进行操作。

  您的上司希望得到的是一个简单的字体选择程序组件,但您知道这并不简单。您将实现一个通用的图标组件,这个组件可在运行时使用一个图像和一个操作进行配置,而且能够完全 Ajax 化,然后您将在字体预览窗口使用您的图标组件。通过这种方式,您将得到一个在将来迟早会用上的图标组件。

  现在,我将向您展示如何使用不超过 25 行 XML 代码实现该图标组件。

  如果您不熟悉如何使用或实现 JSF 2 复合组件,那么您可以从 “JSF 2 简介,第 2 部分:模板及复合组件” 这篇文章中了解基本知识。

  清单 1中的 facelet 为图标组件声明一个名称空间,并在页面中使用该组件。这使用了 JSF 2.0 复合组件 101,详细信息请参见 “JSF 2 简介,第 2 部分:模板及复合组件。”

  请注意,两个图标都为图标的link组件配备了一个动作侦听器。当用户单击图标的链接时,JSF 调用服务器上的该侦听器,如清单 2 所示。

  在清单 2中,我查看触发事件的客户端标识符是否是minus,如果是,我就知道用户单击了减号图标,然后我将减小字体大小。否则,我将增大字体大小。

  前面的 3 个清单展示应用程序中除图标复合组件以外的所有代码。接下来将介绍图标复合组件。

  清单 4中的图标组件声明一个image属性和一个名为link的actionSource。该actionSource在清单 1中用作f:actionListener的for属性的值。如果还不太明白,您可以查看 “JSF 2 简介,第 2 部分:模板及复合组件” 了解动作源如何处理复合组件,其中简短讨论了一个与清单 4中类似的图标实现。

  清单 4中的图标组件实现允许页面作者配置图标的外观和行为,但不允许作者将 Ajax 行为附加到组件。完成实现之后,如果用户单击一个图像,JSF 会提交整个页面,在收到返回值时完全重新绘制该页面。

  缺少的文档称为规范 bug(参见参考资料获取链接以了解更多信息)。JSF 专家组将向规范和 Javadocs 添加文档来修复这一 bug。

  在清单 6中,我为f:ajax标记的render属性指定了readout和fontPreview组件。请注意,我为这些组件标识符添加了一个冒号作为前缀。

  这个冒号迫使 JSF 从组件层次结构的顶部开始搜索组件,否则,JSF 将从离 Ajax 所附加的组件最近的命名容器(通常为一个表单)开始搜索。在图标示例中,该组件为图标的链接,表单为图标的包含该链接的表单。如果删除了冒号,JSF 将开始从图标表单中搜索readout和fontPreview组件,这将产生错误。

  在本文中,我展示了 JSF 2 如何(尽管使用了未经验证的标记)使页面作者能够轻松地将 Ajax 功能添加到复合组件。确实,可以看到,您可以使页面作者能够将发送大量 HTTP 请求的复合组件转变为发送 Ajax 请求的组件。所有这些都只需在复合组件的接口中添加一行 XML 代码来完成。

本文链接:http://odigallery.com/qubiaojizujian/144.html