4.9. User Input Data Validation

Create new RichFaces Documentation Jira issue

This will launch the RichFaces Jira page - to complete your feedback please login if needed, and submit the Jira.

4.9. User Input Data Validation

Validation of user input is a very frequent situation for a developer. RichFaces library offers 3 component to get this job done: <rich:beanValidator>, <rich:graphValidator>, and <rich:ajaxValidator>. The latter two components are used in the Photo Album application. <rich:graphValidator> is intended to validate the whole object or the graph of interrelated objects and the validation occurs when the whole form is submitted. While <rich:ajaxValidator> validates only one input field or a value at a time, validation is activated upon some event and adds interactivity to the application. Both components use Hibernate validators which helps to locate validation logic in one place, such approach is really helpful given that usually data validation logic is stored in multiple places including UI pages and in Java code that interacts with a database.

Let's have a look at the components usage on the registration page. This is how the page looks like (some irrelevant details were removed from the example):


...

<ui:composition xmlns="http://www.w3.org/1999/xhtml" ...

    

    <rich:graphValidator>

        ...

        <h:inputText id="loginName" value="#{user.login}" />

        <rich:messages for="loginName" />

        <h:inputSecret required="true" id="password" value="#{user.password}" />

        <rich:messages for="password" />

        <h:inputSecret required="true" id="confirmPassword"

            value="#{user.confirmPassword}" />

        <rich:messages for="confirmPassword" />

        <h:inputText id="firstname" value="#{user.firstName}" />

        <rich:messages for="firstname" style="color:red;" />

        <h:inputText id="secondname" value="#{user.secondName}" />

        <rich:messages for="secondname" />

        <h:selectOneRadio required="true" id="sex" value="#{user.sex}">

            <f:selectItems value="#{userPrefsBean.sexs}" />

            <s:convertEnum />

        </h:selectOneRadio>

        <rich:messages for="sex" />

        <a4j:outputPanel id="calendar" layout="block">

            <rich:calendar id="birthDate" value="#{user.birthDate}"

                

                <rich:ajaxValidator event="oninputblur" />

            </rich:calendar>

        </a4j:outputPanel>

        <rich:messages for="birthDate" />

        <h:inputText id="email" value="#{user.email}" />

        <rich:messages for="email" />

    </rich:graphValidator>

    <richx:commandButton actionListener="#{authenticator.register(user)}"

        value="Register" />

    <richx:commandButton actionListener="#{controller.cancelRegistration()}"

        immediate="true" value="Cancel" />

</ui:composition>



...

<rich:graphValidator> validates the entity User object, in which restrictions are set with the help of Hibernate annotations. When the Register button is clicked on the name, password, sex etc. fields are validated sequentially. In case of an error (for example, if a loginName contains only one character and the annotation restricts it to at least 3 characters to be typed in) a error message in red color is displayed next to the input field and the request is aborted. If all values are valid the authenticator.register(user) method will be invoked and the user will be saved to the database.

<rich:ajaxValidator> acts in a slightly different way, in our case it is attached to the user.birthDate field. When the value of the field is changed and the field loses focus it is immediately validated. If the input data is incorrect and error message will displayed, which is a quick way to respond to user input errors and avoid sending incorrect data to the server.

If you would like to get more details about the validators that RichFaces library provides please visit Live Demo web page and RichFaces Developer Guide.