JSF第3章

否 否
否 否
否 是
3.3 基本组件 1.标签
–通常用作其他组件的标签。 • for属性(String)：指定与之关联的组件的id值。 • text属性(String)：标签上显示的文本。 • labelLevel属性(int)：通常，值越小，文字显示的 字体越大、越粗。
–说明：标签组件会对关联组件中的设置和更改做出 响应。具体说来，如果输入组件的required属性为 true，则标签组件将显示一个星号。如果因输入无效 服务器拒绝了该页面的提交申请，则在页面中以红色 显示标签组件的文本。
JSF Web 应用开发
2013年7月9日星期二
第3章 UI组件
娄不夜（loubuye@）
3.1 UI组件概述
1. 组件的功能与分类 UI组件是构成用户界面的基本元素，从功能 上可分为三类：
- 向用户显示业务数据或者信息 - 接收用户输入的数据或者信息。 - 允许用户执行指定的业务功能。
3.3 基本组件
8.下拉列表
• items属性(Object)：指定选项数组。 在设计时，当添加一个下拉列表组件时，NetBeans 自动在页面中添加一个“单选选项列表”对象 (SingleSelectOptionsList)，该对象包含一个options 属性，其类型是Option[]，作为下拉列表的选项数组。 下拉列表的items属性会自动与“单选选项列表”对 象的options属性绑定在一起。 右击下拉列表，选择“配置默认选项”，可以设置选 项数组。 • selected属性(Object)：存放下拉列表中被选中的选 项的值(一般可强制转换成String)。
3.3 基本组件
10.复选框
• selected(Object)、selectedValue(Object)： 如果未指定selectedValue属性或其值为 null，则 复选框的行为类似于布尔型控件。在这种情况下， 如果用户选中了复选框组件，则 selected 属性值 是一个结果为 true 的 Boolean 实例。如果未选中 复选框，则 selected 属性值是一个结果为 false 的 Boolean 实例。 如果设置了selectedValue属性，则当复选框被勾 选时，selected属性包含的值等于selectedValue 属性的值，未被勾选时包含null值。
3.2 组件的一般属性
5. toolTip(String) 为组建设置工具提示。 6. tabIndex属性(int) Tab键索引。确定按Tab键时各组件获得焦 点的顺序。
3.2 组件的一般属性
7. disabled(boolean) 禁用标志。取true时，指明不允许用户激活 该组件，并且不会随表单一起提交该组件 的值。 8. visible(boolean) 可见标志。取false时，指明该组件不可见， 因此也不能激活，但其值会随表单一起提 交。 9. rendered属性(boolean) 呈现标志。取false时，指明该组件的HTML 代码不包含在呈现的HTML中。
3.3 基本组件
9. 列表框
• selected属性(Object)：存放列表框中被选中的选 项的值（单选时一般可强制转换成String，多选时 一般可强制转换成String[]）。
3.3 基本组件
10.复选框
–是一个输入类组件，允许用户在一个两值状态中作 出选择。 • label(String)：显示在复选框组件旁边的说明性文 字。
– 在NetBeans中，UI组件被分为基本、布局 和组合三类。
3.1 UI组件概述
2.组件与组件类 在服务器端，每一个UI组件都有一个相应的 Java类。以按钮组件为例，其对应的Java类 为： - 标准的JSF组件包：
ponent.html.HtmlCommandButton
3.3 基本组件
6.超级链接
–两种作用：超级链接或按钮。 • text属性(String)：超级链接显示的文字。 • url属性(String)：指定超级链接所指目标资源的绝 对、相对URL。若没有指定该属性，则组件作为 按钮使用，由执行action方法决定目标资源。 • target(String)：目标资源的打开位置。 _blank：在新的浏览器窗口打开目标资源。 _self：在当前浏览器窗口打开目标资源。3.3来自基本组件12.单选按钮
–与复选框相似的一个输入类组件，两者不同之处在 于，单选按钮一旦被选中便无法取消，而复选框则可 以取消。
3.3 基本组件
13.单选按钮组
–是与下拉列表相似的一个输入类组件，两者只是在 表现形式上不同而已。
14.表、表行组、表列
14.1 概述 - 表组件用来在页面上以二维表形式显示和操作数据。 - 表组件通常包含一个表行组组件，表行组组件决定表 的数据来源。 - 表行组组件通常通过其sourceData绑定到称为“数据 提供器”的不可视组件，数据提供器才是真正的数据 提供者。 - 数据提供器中数据元素的个数决定表的行数，如果行 数太多，可以分页显示。
3.3 基本组件
11.复选框组 –复选框组是一个输入类组件，用来在一组选项中选 择一个或多个。 –复选框组的功能与列表框的功能非常相似，惟一的 区别是：列表框可以被设置成只能单选或允许多选， 而复选框组总是允许多选。 • columns(int)：设置一行显示的复选框数量。 • items(Object) ： 指 定 选 项 数 组 。 复选框组的选项数组来自“多选选项列表”对象 (MultipleSelectOptionsList)，总是允许多选。 • selected属性(Object)：存放列表框中被选中的选 项的值（一般可强制转换成String[]）。
表3-4 rendered、disabled和visible
行为特征 rendered (取false值) 否 否 disabled (取true值) 是 是 visible (取false值) 否 是
组件是否呈现在页面上 组件是否出现在HTML文 档中
组件是否能接受焦点 组件是否被JSF框架处理
3.1 UI组件概述
4. 组件的事件及其响应 – UI组件可以触发两类事件，一类是动作事 件，另一类是值改变事件。 – 可以触发动作事件的UI组件： 按钮、超级链接、图像超级链接 – 可以触发值改变事件的UI组件包括所有的 输入类组件： 文本字段、文本区域、列表框、复选框、 单选按钮等。
3.1 UI组件概述
3.3 基本组件
2.静态文本
–用来在页面上显示一行文本。 • text属性(String)：指定要在页面上显示的文本。 • escape属性(boolean)：取true（默认）时，对文 本中的特殊文字进行转义，这样浏览器就不会将 其解释为HTML标记。
3.3 基本组件
3.文本字段
–最常用的输入类组件，用于接收用户输入的信息。 • text属性(String)：设计时，可设置文本字段的初 始值；运行时，存放用户输入的新的值。 • trim属性(boolean)：取true(默认)时，提交的文本 值的前后空格都被截去。 • columns属性(int)：指定文本字段的宽度（字符列 数）。 • maxLength属性(int)：指定可在此字段上输入的最 多字符数。
4. 组件的事件及其响应 – JSF的事件及其响应机制，遵循JavaBeans 的事件模型规范。JSF支持两种方法响应事 件 ： 一是在页面Bean中直接编写事件处理方法； 二是编写一个专门的监听器类，然后将该 类注册到组件类。
3.1 UI组件概述
5. 组件外观和CSS – 在网页设计中经常使用一种技术 CSS(Cascading Style Sheets，即层叠样 式表)，用以实现HTML文档格式和内容的 分离。 – 在HTML文件中，可以使用标签的style属性 直接指定样式的诸如颜色、字体、对齐方 式等；也可以使用标签的class属性指定已 经定义的样式。 – 在JSF中，UI组件通常有相应的两个属性 style和styleClass，用以指定组件的外观。
3.3 基本组件
4.文本区域
–功能与文本字段组件类似，只不过文本字段只能接 受一行输入，而该组件可以接受多行输入，各行之间 以回车换行符分隔。 • text、trim、columns属性：与文本字段类似。 • rows属性(int)：指定能显示的文本的行数。
3.3 基本组件
5.按钮 - 单击按钮可以提交或重置表单。 - 单击按钮将触发action事件，调用action事件处理程序 (button-id_action方法)。 - 默认情况下，button-id_action方法返回null，此时导 航到当前页面本身。 - 如果要导航到某一固定页面(静态导航)，可在导航编 辑器中打开该页面，然后单击该页面并单击该按钮， 最后拖到您希望按钮打开的页面。 - 如果希望按钮能够根据某些条件确定要打开的页面 (动态导航)，则需要编写button-id_action方法。方法 代码应根据情况返回相应的指示页面导航条件名称的 字符串。
- Visual Web Pack：
ponent.Button
3.1 UI组件概述
3. 组件与页面Bean – 页面和页面Bean有一一对应关系，页面上 的UI组件与页面Bean的属性之间也可以建 立一一对应关系。 – 通过页面Bean，程序员可以访问JSF页面 上的所有UI组件，并且以对象的方式对这 些组件进行操作。
3.3 基本组件
7.图像超级链接
–与普通超级链接的功能完全一样，只不过图像超级 链接可以指定一个图像或者图标来装饰超级链接。
3.3 基本组件
8.下拉列表
–是一个输入类组件，用来从从一组预定的选项中选 择一个选项。 –下拉列表的选项存放在一个Option[]型的选项数组中。 下拉列表通过items属性指定该选项数组。 –选 项 (Option 对 象 ) 有 两 个 属 性 ， 一 个 为 标 签 属 性 label，指定显示在下拉列表中的文字；另一个为值属 性value，是当该选项被选中后实际提交给服务器的 值。 –下拉列表有一个专门的属性selected，用来保存用户 的选择。