CODEWITHSUNDEEP
validationjsfmessage
Peter Penzov
Peter Penzov

Reputation: 1588

f:ajax validation shows only one message at once

I'm working on JSF form with field validation. 

<h:form>
    <h:panelGrid id="panel" styleClass="data_table_pricing" columns="3">

        <h:outputText value="Title"/>

        <h:inputText id="title" value="#{pricingForm.title}" validatorMessage="Value is too big.">
            <f:validateLength minimum="0" maximum="40" />
            <f:ajax event="change" render="@form"/>
        </h:inputText>

        <h:message id="title_message" for="title" style="color:red"/>

        <!-- // -->

        <h:outputText value="First name"/>

        <h:inputText id="first_name" value="#{pricingForm.firstName}" validatorMessage="Value is too big.">
            <f:validateLength minimum="0" maximum="40" />
            <f:ajax event="change" render="@form"/>
        </h:inputText>

        <h:message id="first_name_message" for="first_name" style="color:red"/>

        <!-- // -->

        <h:outputText value="Last name"/>

        <h:inputText id="last_name" value="#{pricingForm.lastName}" validatorMessage="Value is too big.">
            <f:validateLength minimum="0" maximum="40" />
            <f:ajax event="change" render="@form"/>
        </h:inputText>

        <h:message id="last_name_message" for="last_name" style="color:red"/>

        <!-- // -->

    </h:panelGrid>

    <h:commandLink value="reset" class="link" type="reset" style="margin: 20px;">
        <f:ajax execute="@form" render="@form"/>
    </h:commandLink>
    <h:commandLink value="Next" class="link" style="margin: 20px;" actionListener="#{pricingForm.calculatorPage()}">
        <f:ajax execute="@form" render="@form"/>
    </h:commandLink>

</h:form>

When I insert into several input fields big values I see only one error message. Looks like when the form is rendered the old values are not saved. San you help me to solve this?

Upvotes: 0

Views: 623

Answers (1)

BalusC
BalusC

Reputation: 1108722

This,

<f:ajax event="change" render="@form"/>

means the same as: "when the value of the current input is changed, submit and process only the current input and update the whole form".

So, other inputs aren't processed/validated, and the update basically clears out previous messages.

You likely meant to update only the associated message. E.g. in case of your first input:

<f:ajax render="title_message" />

I only omitted event="change" as that's the default already in <h:inputXxx> components.

See also:

Upvotes: 2

Related Questions