immediate attribute for form validation produces unexpected results in JSF

Question

I checked this post and this post, but neither of those solutions gave me a clear answer for my question I'm having on this post. Please try the example below.

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:f="http://xmlns.jcp.org/jsf/core">
    <h:head>
        <title>Facelet Title</title>
    </h:head>
    <h:body>
        <h:form id="employeeForm">
            <h:panelGrid columns="3">
                <h:outputLabel for="employeeFirst" value="First: " />
                <h:inputText id="employeeFirst" immediate="true" onchange="submit()">
                    <f:validateLength minimum="3" maximum="30" />
                </h:inputText>
                <h:message for="employeeFirst" errorStyle="color: red" />
                <h:outputLabel for="employeeLast" value="Last: " />
                <h:inputText id="employeeLast">
                    <f:validateLength minimum="3" maximum="30" />
                </h:inputText>
                <h:message for="employeeLast" errorStyle="color: red" />
                <h:outputLabel for="employeeTitle" value="Title" />
                <h:inputText id="employeeTitle">
                    <f:validateLength minimum="3" maximum="30" />
                </h:inputText>
                <h:message for="employeeTitle" errorStyle="color: red" />
            </h:panelGrid>
        </h:form>
    </h:body>
</html>

If you ran the code above and inserted a value less than 3 characters long into the first input field, you will see a red-colored error message next to the field. This behavior is absolutely fine and expected.

However, if you insert a value between 3 and 30 characters long, the error message for the first field disappears, but the other two input fields produce error messages automatically. I don't want these two error messages to appear automatically after successfully inserting a value into the first input field.

I thought the second and third input fields had immediate attributes set to true in default, so I put immediate attributes and assigned false to each of them, but the result was the same as before.

How can I have only one field in a form to act immediately and not the other fields?

Edit:

I apologize for not making my question clear. I already knew that ajax can handle error message for form validation, but I wanted to let JSF spec leads know that there might be a problem with immediate attribute so that they can fix it for the next release of JSF. I was also hoping that there might be already a solution to this unexpected behavior with immediate attribute, in which case I wanted to hear that through this post. Anyway, thank you for suggesting me I use Ajax for this.

Drop the tutorial that says you should use onchange="submit() and use a more modern one for jsf 2.2. And learn the basics of what a full form submit does and then start reading about a thing called ajax — Kukeltje

Avanish Avanish · Accepted Answer · 2018-10-30T10:52:02

Please use below code. You need to remove onchange="submit(). Instead of submitting everything you can specify exact component which you need to process and update with help of f:ajax. You need to specify list of component ids which you need to process by attribute execute and list of component which you need to update by attribute render.

<h:outputLabel for="employeeFirst" value="First: " />
<h:inputText id="employeeFirst">
    <f:validateLength minimum="3" maximum="30" />
    <f:ajax execute="@this" render="@this errorMessageBlock" event="blur" />
</h:inputText>
<h:message for="employeeFirst" id="errorMessageBlock" errorStyle="color: red" />

immediate attribute for form validation produces unexpected results in JSF

1 Answers