h:inputText - jsf does not render the placeholder

Question

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

My page *.xhtml page looks like this:

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

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

<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:

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

Answer 1

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

Here look at this primefaces showcase

Answer 2

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

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

then use it e.g.:

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

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

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