h:inputText - jsf没有呈现占位符

I want to create a landingPage and I want to save the data in my database through jsf 2.0 and Primefaces 3.5

我想创建一个landingPage，我想通过jsf 2.0和Primefaces 3.5将数据保存到我的数据库中

My page *.xhtml page looks like this:

*我的页面。xhtml页面如下所示:

However, I want to make it look like my HTML page:

但是，我想让它看起来像我的HTML页面:

Besides the CSS my h:inputText should contain a placeholder. My code looks like this:

除了CSS my h:inputText应该包含一个占位符。我的代码是这样的:

<h:form class="homepage_invitee_form" action="" method="POST">
    <h:inputText name="email" placeholder="Email Address"
                 id="email_address_new" type="text placeholder" />
    <br />
    <h:inputText name="firstName" placeholder="First Name"
                 id="firstname_new" type="text placeholder" />
    <h:inputText name="lastName" placeholder="Last Name"
                 id="lastname_new" type="text placeholder" />
    <br />
    <h:button value="Request Invitation" type="submit" class="btn btn-primary opal_btn"
              id="submit_form_new" />
</h:form>

As you can see the placeholder attribute doesn't get rendered. I would really appreciate any idea as to how to render that properly.

正如您所看到的，占位符属性没有被呈现。我很想知道如何恰当地表达。

UPDATE

更新

My HTML code looks like this:

我的HTML代码是这样的:

<form class="homepage_invitee_form" action="" method="POST">
    <input name="email" placeholder="Email Address" id="email_address_new" type="text placeholder"><br>
    <input name="firstName" placeholder="First Name" id="firstname_new" type="text placeholder">
    <input name="lastName" placeholder="Last Name" id="lastname_new" type="text placeholder"><br> 
    <button type="submit" class="btn btn-primary opal_btn" id="submit_form_new">Request Invitation</button>
</form>

3 个解决方案

#1

Use p:watermark in xhtml instead of your placeholders. Other visual design is totally about your css.

在xhtml中使用p:水印，而不是占位符。其他的视觉设计完全是关于你的css。

Here look at this primefaces showcase

看看这个原始面孔的展示

#2

For JSF 2.2 (JEE 7), you can use the namespace

对于JSF 2.2 (JEE 7)，可以使用名称空间

xmlns:p="http://xmlns.jcp.org/jsf/passthrough"

xmlns:p = " http://xmlns.jcp.org/jsf/passthrough "

then use it e.g.:

然后使用,例如:

<h:inputText value="#{bean.field}" p:placeholder="supply value"/>

< h:inputText value = " # { bean。}”p:占位符= "供应值" / >

This passes it through to the generated HTML (NB: HTML 5 attribute).

这将它传递到生成的HTML (NB: HTML 5属性)。

See http://www.adam-bien.com/roller/abien/entry/jsf_2_2_and_html .

见http://www.adam-bien.com/roller/abien/entry/jsf_2_2_and_html。

#3

I ran into this same issue and fixed it. You may not be using the proper xmln namespace on that tag.

我遇到了同样的问题并解决了它。您可能没有在该标记上使用适当的xmln名称空间。

Make sure the "h" xmln namespace is mapped to PrimeFaces. Normally this is mapped to "http://java.sun.com/jsf/html" and the xmln namespace "p" is normally mapped to PrimeFaces, "http://primefaces.org/ui". If you have the normal mappings then you need to change the xmln on that code to "p" instead of "h":

确保“h”xmln名称空间映射到原始面孔。通常，这被映射到“http://java.sun.com/jsf/html”，而xmln名称空间“p”通常映射到黄金面孔，“http://primefaces.org/ui”。如果您有正常的映射，那么您需要将代码上的xmln更改为“p”而不是“h”:

    <h:form class="homepage_invitee_form" action="" method="POST">
       <p:inputText name="email" placeholder="Email Address"
       id="email_address_new" type="text placeholder" />
       <br />
       ...