Input Style

Outlined

Filled

Free Themes

Built-in component themes created by the PrimeFaces Theme Designer.

Saga

Vela

Arya

Legacy Free Themes

Luna Amber

Luna Blue

Luna Green

Luna Pink

Nova

Nova Alt

Nova Accent

PREMIUM TEMPLATES

Create awesome applications in no time using the premium templates and impress your users.

Ajax Framework Events

p:ajax enables ajax features on supported components.

SERVER API

event.xhtml
UserView.java


<div class="card">
    <h:form>
        <h:panelGrid columns="3" cellpadding="5">
            <h:outputText value="KeyUp: "/>
            <p:inputText id="firstname" value="#{userView.firstname}">
                <p:ajax event="keyup" update="out1" process="@this"/>
            </p:inputText>
            <h:outputText id="out1" value="#{userView.firstname}"/>

            <h:outputText value="Blur: "/>
            <p:inputText id="middlename" value="#{userView.middlename}">
                <p:ajax event="blur" update="out2"/>
            </p:inputText>
            <h:outputText id="out2" value="#{userView.middlename}"/>

            <h:outputText value="Input: "/>
            <p:inputText id="lastname" value="#{userView.lastname}">
                <p:ajax event="input" update="out3"/>
            </p:inputText>
            <h:outputText id="out3" value="#{userView.lastname}"/>
        </h:panelGrid>
    </h:form>
</div>


@Named
@RequestScoped
public class UserView {
    
    private String firstname;
    private String middlename;
    private String lastname;

    public String getFirstname() {
        return firstname;
    }

    public void setFirstname(String firstname) {
        this.firstname = firstname;
    }

    public String getMiddlename() {
        return middlename;
    }

    public void setMiddlename(String middlename) {
        this.middlename = middlename;
    }

    public String getLastname() {
        return lastname;
    }

    public void setLastname(String lastname) {
        this.lastname = lastname;
    }

    public void save() {
        FacesContext.getCurrentInstance().addMessage(null,
                new FacesMessage("Welcome " + firstname + " " + middlename + " " + lastname));
    }
}

KeyUp:
Blur:
Input: