InputText组件中的默认文本(占位符)

Question

我想在JSF/Primefaces inputText组件中显示默认的信息性文本.

• 当用户单击"文本"字段时,此文本应消失.
• 当他在没有打字的情况下点击外面时出现.
• 如果用户提交的表单没有任何值,则不应将此默认值设置为Bean的属性.

我知道在ManagedBean中将默认值设置为BeanProperty会有效,但我不希望这样.
如果可能的话,请建议任何JQuery调整.
如果此问题是重复,请将我重定向到问题.

Answer 1

Primefaces提供了placeholder最新版本的属性,您可以使用它p:inputText.此外,还有一个p:watermark组件可以为传统的浏览器兼容性创建基于JS的解决方案.因此,您无需在支持bean中设置默认值.只需使用以下解决方案之一:

<h:outputLabel value="Search: "/>  
<p:inputText id="search_input_id" value="#{watermarkBean.keyword}" 
    required="true" label="Keyword" placeholder="search" />  

对于旧版浏览器:

<h:outputLabel value="Search: "/>  
<p:inputText id="search_input_id" value="#{watermarkBean.keyword}" 
    required="true" label="Keyword" />  
<p:watermark for="search_input_id" value="search" />

此外,如果使用JSF 2.2,您可以使用其passthrough属性.将xmlns:pt="http://xmlns.jcp.org/jsf/passthrough"命名空间添加到页面中,您可以通过以下方式实现JSF h:inputText和Primefaces p:inputText:

<h:inputText value="#{watermarkBean.keyword}"
    pt:placeholder="search" />

或者使用TagHandler将其包装到标记中:

<h:inputText value="#{watermarkBean.keyword}">
    <f:passThroughAttribute name="placeholder"
        value="search"/>
</h:inputText>

这将使用属性创建基于HTML 5的输入placeholder:

<input placeholder="search">