richfaces 下拉框_将RichFaces与JSF 2一起使用

最新推荐文章于 2024-04-14 23:47:42 发布

cuxiong8996

最新推荐文章于 2024-04-14 23:47:42 发布

阅读量134

点赞数

文章标签： java python web html 编程语言

原文链接：https://www.ibm.com/developerworks/opensource/library/j-richfaces4/index.html

版权

richfaces 下拉框

的JavaServer Faces（JSF）2，2009年发布，包含了在许多领域重大修改和补充，包括系统事件，资源，两者的Facelets标准化和Ajax处理（见相关主题）。尽管这种发展通常受到欢迎，但不幸的是，严重的副作用是，实际上为JSF 1.2编写的所有丰富组件框架（包括RichFaces 3.x及更低版本）都不再可靠运行，即使有的话。作为响应，RichFaces团队着手对版本4进行了广泛的重写。正如您将在本文中看到的那样，某些组件名称已经更改；其他组件已被删除，新组件已添加。

RichFaces 4.1

RichFaces 4.1（在撰写本文时处于里程碑和候选阶段）是本文的目标版本。 4.0版本中的一个主要令人失望的地方是缺少List Shuttle组件，该组件允许选择和订购多个项目。版本4.1通过将顺序添加到“选择列表”组件中来纠正该遗漏。

在我2008年的文章“ RichFaces简介 ”中，我介绍了多个RichFaces 3.1版组件，并解释了RichFaces和JavaServer Faces（JSF）1.2的安装要求。此后续文章既可作为RichFaces新手的开发人员指南，也可用于从以前的版本迁移到4.x版本。我为WAR提供了演示代码（请参阅下载）。

如果您不熟悉RichFaces，并且想将其与JSF 2一起使用，请仅阅读本文（尽管您可能希望查看上一篇文章的资源）。如果您在版本4之前使用过RichFaces，建议您同时阅读这两篇文章。为了更轻松地比较版本差异，我在两者中都使用了相同的节标题。我还努力复制了组件的外观和功能。

从这一点开始，如果我没有提到特定版本，我将使用RichFaces来引用版本4.x。我将首先看一些使用RichFaces开发所需的基础架构元素。

从一开始就

使用RichFaces开发的最低基础架构要求是：

Java™SE 6
Servlet 2.5容器
最新的浏览器，例如Firefox 3.5或Internet Explorer 7或更高版本

为了进行开发和测试，我使用了JDK 7，Apache Tomcat 7.0.22和GlassFish 3.1.1。我使用的浏览器是Firefox 7.0.1和Internet Explorer 8。

从我的设置以及上述最低要求来看，您一般不会遇到任何问题。但是，有关演示代码，有些事情要牢记：

如果使用仅支持Servlet 2.5的容器，则必须在web.xml中将<web-app version="3.0"...>更改为<web-app version="2.5"...> 。
对于GlassFish V3和其他具有JEE 6 / JSF 2支持的容器，您可以从演示项目中删除javax.faces.jar。该演示中使用的版本是mojarra-2.1.4。
在邮件列表中，我看到某些JSF 2版本和较旧的容器上偶尔出现表达式语言（EL）问题。如果结果不正常，请尝试下载最新的EL JAR。

本文假定读者具有JSF 2和Tomcat或GlassFish的基本知识。如果您需要更多有关这些技术的背景知识，请参见参考资料中的适当链接。

不小的面Kong

尽管Facelets叫它名字，但它并不是JSF的较小版本。取而代之的是，Facelets在其核心处提供了JavaServer Pages（JSP）的替代品作为JSF ViewHandler 。 Facelets支持所有JSF UI组件，并构建其自己的组件树，以反映JSF应用程序的视图。 JSF 2规范将JSP弃用为视图定义语言（VDL），并包括Facelets的标准版本作为首选VDL。因此，RichFaces放弃了对JSP的支持，并要求使用Facelets。

我更喜欢保持事物整洁和直接。在示例项目中，您将看到几乎所有页面代码（与标记相反）都由用于吸气剂，设置器和方法绑定的EL表达式组成。尽管更复杂的项目可能需要更复杂的表达式，但一般而言，Facelets使将Java代码与网页标记分开的工作变得容易。

与使用JSP进行JSF 2之前的开发相比，您将在这里注意到的主要区别是：

web.xml和faces-config.xml中的一些其他符号是必需的或默认的。
网页是XHTML文档。
使用XML命名空间而不是JSP标签库。

就格式化而言，除了开头部分（参见清单1）之外，网页代码中的所有内容都应该看起来很熟悉。我认为这是一个低估的Facelets功能。对于本文的项目（以及其他许多使用Facelets来处理视图的其他项目），这实际上是您需要知道的全部。 Facelets还包括许多其他有用的功能，例如简单的模板和使网页设计人员的生活更轻松的元素。（要了解有关Facelets的更多信息，请参阅参考资料。）

清单1. Facelets XHTML文档的初始部分

<?xml version='1.0' encoding='UTF-8' ?>
<!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:ui="http://java.sun.com/jsf/facelets">

演示组件

最初，RichFaces似乎不堪重负；平均组件具有20多个特定属性，以及可以被覆盖的常规属性。但是，在典型用法中，组件的设置并不困难，大多数属性具有合理的默认值。版本4引入了更改的默认值和其他默认值，值得检查文档。

本文演示的主要组件（指出了版本4的替代组件）是：

日历：一个允许选择日期的弹出组件。图1显示了一个示例。 <和>滚动月份； <<和>>滚动年份。单击底部的今天以选择今天的日期。清除清除日期选择。左侧的第一列数字显示一年中的星期。
图1. RichFaces Calendar组件
选择清单 ：选择和订购组件。 Pick List是List Shuttle的第4版替代品 ，可以在可用区域和选定区域之间以及在选定区域中上下移动项目。图2显示了一个示例：
图2. RichFaces Pick List组件
自动完成 ： 建议盒输入组件的版本4替代，它提供可单击的建议来填写或完成输入。图3显示了一个示例：
图3. RichFaces AutoComplete组件
标签面板 ：创建标签页面的输出组件。图4显示了一个示例：
图4. RichFaces选项卡面板组件
手风琴 ： 面板栏输入组件的第4版替代品 。该示例项目使用手风琴进行指导。图5显示了一个示例：
图5. RichFaces手风琴组件
可折叠面板 ： Simple Toggle Panel组件的第4版替代品 。该示例项目将可折叠面板用于结果。图6显示了一个示例：
图6. RichFaces可折叠面板组件

RichFaces的是建立在Ajax4jsf的（参见相关主题）。有了这个基础，任何组件都可以通过几种不同的方式启用Ajax。在版本4中，Ajax功能通常是自动的或默认的。该示例应用程序对AutoComplete和Collapsible Panel组件使用Ajax功能。

我勇敢的脸

dwRichFaces4Demo1示例应用程序很小。其唯一的真实目的是演示所选组件的设置和使用。因此，它所做的就是收集并显示输入数据。我将让您想象一下如何在生产应用程序中使用数据和组件。除了必需的JAR，图像，支持资源束的属性文件和级联样式表（CSS）文件之外，该应用程序还包含两个XHTML页面和两个Java类。

假设默认设置为Tomcat或GlassFish，图7中显示的输入页面的URL为http：// localhost：8080 / dwRichFaces4Demo1。在输入页面上，您可以使用日历组件选择日期。 拣配清单组件使您可以移动和重新排列可用物料。 City AutoComplete组件使您可以键入城市名称。 City已启用Ajax；如果按空格键，将显示所有可用的城市。如果您键入以A或J开头的城市名称，则会显示相应城市的列表。键入更多字符时，列表中的可用城市会变窄。您可以单击左侧的“手风琴”项目以获取基本的组件说明。

图7. `dwRichFaces4Demo1`输入页面

输入条目后，单击“ 提交”按钮。该应用程序非常小，无法执行任何编辑。由于“日历”组件的手动输入已禁用，因此您甚至无法输入无效的日期。 Submit按钮导致显示结果页面，如图8所示：

图8. `dwRichFaces4Demo1`结果页面

在结果页面上，单击“ 结果”选项卡，然后单击相应的“可折叠面板”项以查看输入值。单击编辑按钮返回到输入页面。

注意，图7中的Submit按钮和图8中Edit按钮的背景色与其他元素的背景色匹配，即使这些按钮是标准JSF组件，而不是RichFaces组件。下一节将介绍原因。

陷害我

对于应用程序来说，最重要的第一件事就是JSF，Facelets和RichFaces启用程序，即实现其功能的JAR。对于迁移，请注意，依赖关系在版本4.x中已完全更改。这些JAR（具有以下标记的版本）包含在可下载的WAR的lib目录中（请参阅下载）。该列表假定您的Web容器支持当前的EL和Servlet API版本。如果您有运行演示问题，请检查JSF，Facelets和RichFaces的需求（参见相关主题。）您也应该阅读下载音符。

任何RichFaces项目所需的JAR为：

JSF 2（包含在JEE 6容器中，例如GlassFish V3.x）
- javax.faces.jar
小面
- 包含在JSF 2 JAR中
RichFaces
- RichFaces的组件-API- 版本的.jar
- RichFaces的组件-UI- 版本的.jar
- richfaces-core-api- ver .jar
- richfaces-core-impl- ver .jar
其他必需的依赖项：
- cssparser- 版本的.jar
- guava- 版本的.jar
- SAC- 版本的.jar

在我的项目中，并包含在下载的WAR中（请参阅参考资料，了解下载站点），使用的版本为：

JSF 2
- javax.faces.jar — mojarra-2.1.4
小面
- 包含在javax.faces.jar中
RichFaces
- richfaces-components-api-4.1.0.20111111-CR1.jar
- richfaces-components-ui-4.1.0.20111111-CR1.jar
- richfaces-core-api-4.1.0.20111111-CR1.jar
- richfaces-core-impl-4.1.0.20111111-CR1.jar
其他必需的依赖项：
- cssparser-0.9.5.jar
- 番石榴10.0.1.jar
- sac-1.3.jar

接下来是启用JSF所需的web.xml条目，如清单2所示。请注意，当将JSF 2与Servlet 3.0容器一起使用时，这些条目是可选的。我宁愿明确。如果省略，则会自动映射*.faces ， *.jsf和/faces/* <url-pattern /> 。

清单2. web.xml中的最小JSF条目

<servlet>
   <servlet-name>Faces Servlet</servlet-name>
   <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
   <load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
   <servlet-name>Faces Servlet</servlet-name>
   <url-pattern>*.jsf</url-pattern>
</servlet-mapping>

在JSF 2之前，Facelets需要一个javax.faces.DEFAULT_SUFFIX条目才能使.xhtml覆盖.jsp默认后缀。不再需要该条目，因为Facelets现在是默认的VDL。

RichFaces 4不再需要org.ajax4jsf.VIEW_HANDLERS ， filter或filter-mapping元素。您可以直接放入JAR并使用它。

清单3显示了演示应用程序中使用的与RichFaces相关的web.xml条目：

清单3. web.xml中与RichFaces相关的条目

<context-param>
  <param-name>org.richfaces.skin</param-name>
  <param-value>classic</param-value>
</context-param>
<context-param>
  <param-name>org.richfaces.enableControlSkinning</param-name>
  <param-value>true</param-value>
</context-param>

清单3包含两个上下文参数：

<param-name>org.richfaces.skin</param-name>定义应用程序的配色方案（皮肤）。 RichFaces具有多个内置皮肤。 classic皮肤是中等的蓝色。如果省略此元素，则默认为浅灰色。
<param-name>org.richfaces.enableControlSkinning</param-name>值会同时影响RichFaces 和标准JSF组件的外观。如果其值为true ，则对标准控件进行外观设置。例如，这就是为什么图7和8中的Submit和Edit按钮与RichFaces主题具有相同的颜色的原因。如果省略此元素，则默认值为true 。

关于清单2和3的条目的好消息是，它们在所有应用程序中实际上都是相同的，并且实质上是样板代码。如果您愿意接受默认值并且不关心明确的默认值，则可以完全省去它们。

您将在每个应用程序中看到更多内容：应用程序XHTML页面中的RichFaces命名空间。清单4是清单1的修改，其中包括RichFaces命名空间：

清单4. Facelets / RichFaces XHTML文档的初始部分

<?xml version='1.0' encoding='UTF-8' ?>
<!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:ui="http://java.sun.com/jsf/facelets" 
      xmlns:a4j="http://richfaces.org/a4j"
     xmlns:rich="http://richfaces.org/rich" >

准备摇滚

现在，您准备好如何使用RichFaces组件。我将从手风琴和手风琴项目开始（请参见图5 ）。它们代替了RichFaces 4之前的版本中的面板栏和面板栏项。您可能不会经常使用它们，但是它们易于使用，并且为RichFaces语法提供了很好的首次使用案例。

这里的想法是，手风琴是手风琴物品的容器。手风琴项目具有标题，可以包含任何其他组件。手风琴物品彼此叠放；单击项目的栏会显示实际内容。一次仅显示一项内容。在这种情况下，如清单5所示，我仅使用文本。注意，所有组件都有一个rich:前缀，它引用清单4中包含的名称空间条目。在演示中，手风琴包含在标准的JSF PanelGrid ：

清单5. RichFaces手风琴组件

<rich:accordion style="width: 256px;" styleClass="floatLeft">
    <rich:accordionItem header="#{dwRF4D1.calComp} #{dwRF4D1.info}">
        <h:outputText value="#{dwRF4D1.calCompText}" style="font: menu;" />
    </rich:accordionItem>
    <rich:accordionItem header="#{dwRF4D1.plComp} #{dwRF4D1.info}">
        <h:outputText value="#{dwRF4D1.plCompText}" style="font: menu;" />
    </rich:accordionItem>
    <rich:accordionItem header="#{dwRF4D1.acComp} #{dwRF4D1.info}">
        <h:outputText value="#{dwRF4D1.acCompText}" style="font: menu;" />
    </rich:accordionItem>
</rich:accordion>

基本的<rich:accordionItem />元素只需要一个标头就可以了，而在这里，标头是使用EL表达式从资源束中提取的。

演示手风琴项目的实际内容只是一个<h:outputText />元素，同样包含资源包中的文本。我使用font样式元素来保持一致的可读性，并且还表明RichFaces允许CSS灵活性。

请注意，无需程序员参与生成JavaScript。仅需几个步骤，您就可以创建一个外观漂亮的多面板可单击组件。这是RichFaces的强大优势之一。甚至像这样简单的组件也允许Ajax（通过switchType属性），活动/不活动的样式，事件等。

我们约会吧

Calendar组件（请参见图1 ）应该很熟悉；日期选择可能是最早JavaScript网页增强功能之一。 RichFaces日历具有80多个可用属性，但是，如清单6所示，您可以在几行中启用许多功能：

清单6. RichFaces Calendar组件

<label for="CalendarID" >#{dwRF4D1.calendar}:</label>
<rich:calendar id="CalendarID"
               value="#{dwRF4D1Handler.selectedDate}"
               timeZone="#{dwRF4D1Handler.timeZone}"
               datePattern="#{dwRF4D1.datePattern}" >
</rich:calendar>

datePattern属性需要由java.text.SimpleDateFormat定义的标准日期模式。该示例再次使用资源束作为值，该值将datePattern键定义为yyyy-MM-dd 。 value和timeZone属性是使用来自受管bean的方法加载的，该方法在faces-config.xml中定义，如清单7所示：

清单7. `dwRF4D1Handler`托管bean定义

<managed-bean>
  <managed-bean-name>dwRF4D1Handler</managed-bean-name>
  <managed-bean-class>com.dw.dwRF4D1Handler</managed-bean-class>
  <managed-bean-scope>session</managed-bean-scope>
</managed-bean>

com.dw.dwRF4D1Handler类是基本类（主要由初始化程序，getter和setter组成），不需要进一步讨论。 getSelectedDate()和setSelectedDate()方法需要一个java.util.Date 。 getTimeZone()方法仅返回java.util.TimeZone.getDefault() ; 在生产中是否合适取决于您的应用要求。

如果您还希望允许用户键入日期值，请将enableManualInput属性设置为true 。如果只想显示日历，请将popup属性设置为false 。显然，还有许多其他设置可用，但这就是基本日历功能所需的全部。

如果要从以前的RichFaces版本进行迁移，则为演示代码中的功能设置日历组件在版本4中实际上是相同的。

不管怎样

具有orderable属性的Pick List组件（版本4的List Shuttle的替代品，请参见图2和RichFaces 4.1侧栏）非常适合从初始组中选择和订购商品。清单8展示了它比您最初想象的还要容易使用：

清单8. RichFaces选择列表组件

<label for="plID">#{dwRF4D1.pl}:</label>
<rich:pickList id="plID
               value="#{dwRF4D1Handler.orderByTarget}" 
               orderable="true" listWidth="10em" 
               sourceCaption="#{dwRF4D1.available}"  
               targetCaption="#{dwRF4D1.selected}" >
     <f:selectItems value="#{dwRF4D1Handler.orderBySource}" />
</rich:pickList>

示例代码中的XHTML标记包括其他属性来覆盖某些默认标签，但是典型用法仅需要value ， <f:selectItems />和通常为orderable 。

该value对选定的值和<f:selectItems />为可选项有java.util.List含有任何类型的对象类。在JSF 2中， <f:selectItems />可以是包含任何类型的对象的集合或数组。调用toString()提供标签。与演示代码一样，您大多数时候可能会使用包含String的列表。除了<f:selectItems />属性值的List初始化之外，清单9还显示了与示例Pick List相关的所有Java源代码。 Java代码实际上与“ RichFaces简介 ”中使用的代码相同。

清单9.相关的`dwRF4D1Handler`选择列表代码

private List<String> lOrderBySource = new ArrayList<String>(),
                     lOrderByTarget = new ArrayList<String>();
...
public List getOrderBySource()
{
  return lOrderBySource;
}

public List getOrderByTarget()
{
  return lOrderByTarget;
}
...
public void setOrderBySource( List<String> orderBySource )
{
  lOrderBySource = orderBySource;
}

public void setOrderByTarget( List<String> orderByTarget )
{
  lOrderByTarget = orderByTarget;
}

用户做出所需的选择后，您的处理程序在提交时会收到包含该选择的列表。

告诉我我的脸

如果您经常访问论坛和邮件列表，则迟早会看到一个问题，询问如何处理将成千上万个条目下载到下拉列表中。 AutoComplete组件（请参见图3 ）代替了意见箱，它提供了一种显示有效输入选择的方式，而不会尝试那种无法解决的极端情况。实际上，这种担心是我开始研究RichFaces和类似套件的一个主要原因：正在进行的应用程序中的多个输入项（例如城市）对于下拉列表的实用性而言存在太多的可能性。自动完成功能类似于许多桌面应用程序中提供的熟悉的自动完成组件。很明显，这种能力可能必须涉及Ajax提交，才能有机会在Web应用程序中有效地工作。

清单10显示了AutoComplete组件的标记。该字段的输入可以是键输入，也可以从下拉列表中选择。

清单10. RichFaces AutoComplete组件

<h:form>
  <a4j:queue ignoreDupResponses="true"/> 

...

<label for="CityID">#{dwRF4D1.city}:</label>
<rich:autocomplete id="CityID" mode="ajax" 
                   value="#{dwRF4D1Handler.city}"  
                   autocompleteMethod="#{dwRF4D1City.suggest}" 
                   autofill="false" 
                   selectedItemClass="selCtl" > 
</rich:autocomplete>

如果您以前使用了意见箱，则将不胜感激AutoComplete的简化。所需的最小属性是mode ， value和autocompleteMethod ：

mode通常是ajax ，每次击键都会引起Ajax请求-非常好，并且基本上是自动的。其他值为： Cached Ajax ， Client和Lazy Client 。
该value与大多数其他组件的value相同：通常是来自托管bean的getter和setter。
该autocompleteMethod方法是suggest()在基于演示代码，第二Java类另一个托管bean com.dw.City 。该方法的签名是public List suggest(Object anObject) 。

在演示代码中，将在初始化时创建以A和J开头的城市列表。如果用户按下“城市”文本字段中的空格键，则返回整个列表。如果按A，则返回包含以A开头的城市的子列表； J个城市的处理方式相同。每次击键都会缩小结果。在您自己的代码中，您可以执行适合输入的任何所需操作。在我的生产应用程序中，结果来自有限的数据库集，这可能是最典型的。如果您熟悉数据，通常可以采用该方法中的步骤来优化结果。例如，在某些情况下，某些按键可以忽略，因此该方法仅返回，从而消除了访问数据库的麻烦。

在4.x版中，RichFaces建立在标准JSF队列上。 <a4j:queue />属性不是必需的，但您可能希望经常使用它。它在这里用于ignoreDupResponses ；查看文档以了解其他功能。请注意， <a4j:queue />仅用于RichFaces组件事件。您可以在视图或表单级别使用它。可以通过<param-name>org.richfaces.queue.global.enabled</param-name>上下文参数在web.xml中启用全局应用程序队列。

您还可以创建一个命名队列，该组件使用<a4j:attachQueue name="myRequestQueue" />引用。

selectedItemClass是要应用于组件CSS类。 RichFaces使用皮肤概念。这会一直进行到组件的选择背景。我自己的应用程序有几个标准的JSF下拉列表，这些列表使用系统颜色作为背景。 AutoComplete组件使用classic外观颜色，使外观看起来不一致。该SelCtl类告知使用该组件lightgrey背景颜色来代替。

保持标签

Tab Panel组件（参见图4 ）易于使用，尽管对于迁移，您应该注意一些更改。典型的RichFaces属性是可用的，但是您将使用的主要属性是switchType 。其默认值为server 。要获取恒定的信息，您可能最经常需要client ；也可以使用ajax 。从清单11中可以看到，典型的<rich:tabPanel />元素的RichFaces“三明治”和<rich:tab />元素的堆叠“三明治”用于制作一组选项卡式页面：

清单11. RichFaces选项卡面板组件

<rich:tabPanel switchType="client" >
        <rich:tab >
          <f:facet name="header">
            <h:panelGrid columns="2">
              <h:outputText value="#{dwRF4D1.info}" />
              <h:graphicImage value="/images/roseTab.jpg" height="20" width="25" />
            </h:panelGrid>
          </f:facet>
          #{dwRF4D1.resultText}
        </rich:tab> 

        <rich:tab header="#{dwRF4D1.result}">
...
        </rich:tab> 
... 
</rich:tabPanel>

header属性用于每个选项卡的显示名称。通常，在演示代码中，标头值是从资源束中提取的。像“手风琴项”一样，选项卡可以包含任何类型的组件。在演示中，我将资源束文本用作“信息”选项卡内容，将“可折叠面板”用作“结果”选项卡内容。

作为header属性的替代方法，可以使用名为“ header”的<f:facet />来包含其他内容。演示代码使用<h:panelGrid />包含“信息”选项卡标题的文本和图像。

每当我看到你的笑脸

可折叠面板是Simple Toggle Panel的4.x版本替代。它由一个条和一个内容显示组成，该内容显示可以是任何组件（请参见图6 ）。使用header属性作为标题。单击该条可以显示或隐藏内容，就像手风琴只有一项。清单12显示了演示项目的Collapsible Panel标记：

清单12. RichFaces可折叠面板组件

<h:panelGrid columns="1" width="50%">
  <rich:collapsiblePanel switchType="ajax" 
                         header="#{dwRF4D1.calComp} #{dwRF4D1.value}" 
                         expanded="false" >
      #{dwRF4D1Handler.selectedDate} 
  </rich:collapsiblePanel> 
  <rich:collapsiblePanel switchType="ajax" 
                         header="#{dwRF4D1.plComp} #{dwRF4D1.value}" 
                         expanded="false" >
      #{dwRF4D1Handler.orderByTarget} 
  </rich:collapsiblePanel> 
  <rich:collapsiblePanel switchType="ajax" 
                         header="#{dwRF4D1.acComp} #{dwRF4D1.value}" 
                         expanded="false" >
      #{dwRF4D1Handler.city}
  </rich:collapsiblePanel> 
  <rich:collapsiblePanel switchType="ajax" 
                         header="#{dwRF4D1.face}" 
                         expanded="false" >
       <img src="images/myphoto.jpg" 
            height="80" width="64"/>
  </rich:collapsiblePanel>
</h:panelGrid>

注意， switchType属性重新出现。除了代码中使用的ajax值之外，还可以使用client和server值。 expanded属性确定内容是否显示在第一个显示器上。对于该演示，我已经在JSF <h:panelGrid />放置了多个可折叠面板，该面板位于一个选项卡中，该标签又位于一个选项卡面板中。

结语

RichFaces提供了大量用于构建RIA和支持Ajax的应用程序的JSF组件。本文仅演示了一些，但是您应该对RichFaces下的工作原理有所了解，并看到了在许多应用程序中可能有用的几个组件。随着版本4的引入，Richfaces现在与JSF 2兼容，并且包括您将欣赏的简化和效率。所有的套房，文档中提供的组件和其它资源的在线演示都可以从RichFaces的项目页面（请参阅相关主题）。

如果您选择使用RichFaces，我鼓励您深入研究文档中讨论的a4j:组件和处理，以了解如何将这些概念应用于其他RichFaces组件。您投入的研究时间将为您的开发流程和运行时性能带来丰厚的回报。

翻译自: https://www.ibm.com/developerworks/opensource/library/j-richfaces4/index.html

richfaces 下拉框

cuxiong8996

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
richfaces 下拉框_将RichFaces与JSF 2一起使用

的JavaServer Faces（JSF）2，2009年发布，包含了在许多领域重大修改和补充，包括系统事件，资源，两者的Facelets标准化和Ajax处理（见相关主题）。尽管这种发展通常受到欢迎，但不幸的是，严重的副作用是，实际上为JSF 1.2编写的所有丰富组件框架（包括RichFaces 3.x及更低版本）都不再可靠运行，即使有的话。作为响应，RichFaces团队着手对版本4进...
复制链接

扫一扫