CODEWITHSUNDEEP
validationjsf
Timbo
Timbo

Reputation: 133

Validate two components with dynamic id

Here is what I am trying to do:
I have a form with multiple pairs of input fields and a save button.
When the save button is pressed then for each pair of input fields should be validated if they are numbers and if the left value is smaller than the right value.
If not the validation errors will be shown and if it is the case a dialog will pop up to ask for the name under which it should be saved.

Here is what I got so far:

<h:form>
    <ui:repeat value="#{myBean.someList}" var="elem">
        <h:inputText id="min#{elem.id}" value="#{elem.minimum}" />
        <h:inputText id="max#{elem.id}" value="#{elem.maximum}" />
        <br />
        <h:message for="min#{elem.id}" style="color:red" />
        <h:message for="max#{elem.id}" style="color:red" />
    </ui:repeat>
    <h:commandButton value="save">
        <f:ajax execute="@form" render="@form updateValidationFailedFlag"
            onevent="
                function(ajaxResult){
                    if(ajaxResult.status=='success' &amp;&amp; !globalValidationFailedFlag)
                        showSaveDialog();
                }"
        />
    </h:commandButton>
    <h:outputScript id="updateValidationFailedFlag">
        globalValidationFailedFlag = #{facesContext.validationFailed};
    </h:outputScript>
</h:form>

This works but doesn't check if the minimum is smaller then the maximum. It will validate the input (checks if the input are integer) and shows the save dialog if no validation error occured.

To check if the minimum is smaller then the maximum I tried to follow the tutorial at http://www.mkyong.com/jsf2/multi-components-validator-in-jsf-2-0/

Variant 1 adds a listener after the validation is done and is able to add error messages that are shown in the browser. But that doesn't count as a validation failure and doen't set the facesContext.validationFailed flag.

Variant 2 writes a custom validator for one component and gives the other component as parameter to that validator. That would look something like this:

    <f:validator validatorId="myValidator" />
    <f:attribute name="maximum" value="#{max#{elem.id}}" />

That is not really valid EL and I don't know how to write it correctly.

What can I do to validate if each of those min-max pairs is valid

Upvotes: 1

Views: 678

Answers (1)

BalusC
BalusC

Reputation: 1109332

You don't need #{elem.id} here. The <ui:repeat> already takes care of that. It would be evaluated to an empty string anyway when JSF needs to set the id attribute.

<ui:repeat value="#{myBean.someList}" var="elem">
    <h:inputText id="min" value="#{elem.minimum}" />
    <h:inputText id="max" value="#{elem.maximum}" />
    <br />
    <h:message for="min" style="color:red" />
    <h:message for="max" style="color:red" />
</ui:repeat>

As to the validation, just pass the value of the other component along:

<h:inputText id="min" binding="#{min}" value="#{elem.minimum}" />
<h:inputText id="max" value="#{elem.maximum}">
    <f:validator validatorId="myValidator" />
    <f:attribute name="min" value="#{min.value}" />
</h:inputText>

Note that I moved the validator to the second component. Otherwise it would be still invoked if the second component didn't pass conversion.

If you happen to use JSF utility library OmniFaces, then you could use its <o:validateOrder> instead.

<h:inputText id="min" value="#{elem.minimum}" />
<h:inputText id="max" value="#{elem.maximum}" />
<o:validateOrder components="min max" showMessageFor="min" />

See also:

Upvotes: 1

Related Questions