Default text (placeholder) in InputText component

后端 未结 2 1963
悲&欢浪女
悲&欢浪女 2021-01-18 17:13

\"enter

I want to display a default Informative text in JSF/Primefaces inputTe

相关标签:
2条回答
  • 2021-01-18 18:10

    Primefaces provides a placeholder attribute in its latest versions which you can use for p:inputText. Also, there is a p:watermark component which creates a JS based solution for legacy browser compatibility. So you don't definitely need to set a default value into the backing bean. Just use one of the following solutions:

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

    For legacy browsers:

    <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" />
    

    Also if using JSF 2.2, you can use its passthrough attributes. Adding xmlns:pt="http://xmlns.jcp.org/jsf/passthrough" namespace to your page, you can achieve in the following way, both for JSF h:inputText and Primefaces p:inputText:

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

    Or wrapping it into the tag with a TagHandler:

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

    Which creates HTML 5 based input with placeholder attribute:

    <input placeholder="search"> 
    
    0 讨论(0)
  • 2021-01-18 18:11

    A jQuery tweak would be:

    <p:inputText styleClass="search" value="#{filter.search}"/>
    <script type="text/javascript">
      $('input.search).attr('placeholder','search');
    </script>
    

    You don't need to put an extra component in order to set attribute only, and you can mass-enrich inputs (if you need to).

    0 讨论(0)
提交回复
热议问题