Practical_RichFaces要点Chapter05

Chapter05      Input Components

 

1.       a4j: 提供了页面级的 Ajax 支持，也就是框架级的基本控制； rich: 提供了控件级的 Ajax 支持、布局控件以及客户端控件。

 

 

2.       使用 <rich:inplaceInput>

1)      defaultLabel 属性，可以点击该属性以编辑控件的值；

2)      对于控件值的修改只是在 Browser 上的行为，不会向 Server 传递任何数据；

3)      showControls 属性用来控制是否显示 Save/Cancel 按钮；

4)      controlsHorizontalPosition 和 controlsVerticalPosition 用来控制 Save/Cancel 的位置；

5)      也可以使用自定义的控制器 Control ，只需要在体中加入一个 <f:facet> ，像这样：

<rich:inplaceInput id="inputEmail" value="#{inplaceInputBean.email}"

defaultLabel="Click to edit email" showControls="true"

controlsVerticalPosition="bottom"

controlsHorizontalPosition="left">

<f:facet name="controls">

<button οnclick="#{rich:component('inputEmail')}.save();" type="button">

Save

</button>

<button οnclick="#{rich:component('inputEmail')}.cancel();" type="button">

Cancel

</button>

</f:facet>

</rich:inplaceInput>

 

6)       一旦自定义 Control 被启用，那么 showControls 属性也就隐式地被启用了。

7)       控件也提供了一些特定事件给 <a4j:support> 的，当控件状态改变的时候，这些事件就会被调用来发送 Ajax Request 。

• oneditactivation ：当激活 edit 状态的时候，会触发 Ajax Request ；

• oneditactivated ：当控件变为 edit 状态后，会触发 Ajax Request ；

• onviewactivation ：当激活 view 状态的时候，会触发 Ajax Request ；

• onviewactivated ：当控件状态变为 view 状态后，会触发 Ajax Request （这个最常用）。

 

 

 

3.       使用 <rich:inplaceSelect>

1)       用法及属性与 <rich:inplaceInput> 非常相似，也包括 defaultLabel 、 showControls 、 controlsHorizontalPosition 等属性；

2)       与标准 JSF 的选择类控件相同，使用 <f:selectItem> 和 <f:selectItems> 传递选项；

3)       也可以像 <rich:inplaceInput> 用 <f:facet> 使用自定义 Control 。

 

 

4.       使用 <rich:suggestionbox>

1)       当在 Input Field 里输入值的时候，控件会向 Server 发送 Request ， Server 上的特定 Listener 被调用。该 Listener 根据输入值，返回一个建议值的集合。

2)       suggestAction 指定用于返回建议值范围的 Listener ，该 Listener 的名字不限，但应该满足以下两点：

· 具有一个 Object 类型的参数，代表输入的内容，这个 Object 实际上应该是一个 String 对象；

· 返回一个集合对象，代表建议的值范围，集合的类型应该是 <h:dataTable> 能够接受的。

例如： public ArrayList <State> suggest (Object value)

 

3)       只要 Listener 满足以上格式要求即可运行，至于返回什么值作为建议范围，则应该由用户编程实现。注意返回的是实际对象的集合，而不是 SelectItem 的集合。

4)       <rich:suggestionbox> 并不提供输入框，因此需要使用 for 属性指定一个现有的输入框。

5)       像 <h:dataTable> 一样，拥有 var 属性作为元素引用的名字， String 类型；也通过 <h:column> 设置每列的显示信息。

6)       列顺序是可以灵活改变的。默认情况下，被选中的建议值的第一列会被取出来作为输入框的值。当然，也可以使用 fetchValue 属性来指定某一列作为输入框的值。

7)       fetchValue 属性可以接受各种插入值，比如 fetchValue="#{state.name} – #{state.capital}" 。

8)       minChars 属性用来设置可以产生 Ajax Request 的最小字符数。

9)       eventsQueue 和 requestDelay 属性与之前遇到的功能相同。

10)   nothingLabel 用来显示没有查找到建议范围的情况。

 

【疑问】

虽然也包含 bypassUpdates 属性，但测试了一下， true 和 false 的效果似乎一样。用 PhaseListener 检测了一下，虽然都会产生 Ajax Request ，并且经历完整 JSF 生命周期，但输入框所对应的 managed bean 的属性值似乎并未改变。网上有国外的新闻组说 3.3.1GA 版的 <rich:suggestionbox> 的 bypassUpdates 属性存在 bug ，等待后续修正。

 

 

5.       使用 <rich:comboBox>

1)       这个控件是一个客户端 的建议控件，它会预先 render 整个值列表。

2)       <rich:comboBox> 的建议值列表不是从 Server 的 suggestAction 的得来，而是从 <f:selectItem> 和 <f:selectItems> 指定的完整值列表里得来。

3)       另一个指定建议值来源的方法是使用 suggestValues 属性，该属性接受 managed bean 的实际对象的集合，注意这里不是 SelectItem 的集合。

4)       也同样拥有 defaultLabel 等属性。

5)       directInputSuggestions 属性设为 true 时，建议值将直接出现在输入框里。

 

 

6.       使用 <rich:inputNumberSlider> 和 <rich:inputNumberSpinner>

1)       maxValue 和 minValue 设置取值范围；

2)       step 设置步进单位；

3)       enableManualInput 设置是否启用手动输入，默认为 true ；

4)       showInput 设置是否显示输入值；

【疑问】

在 <rich:inputNumberSpinner> 框里，按回车键会引发页面提交，很奇怪。

 

 

7.       使用 <rich:calendar>

1)       dataPattern 设置时间日期格式，比如： yyyy-MM-dd hh:mm a

2)       值类型应为 java.util.Date 。