How to validate form with several input fields in JSF/Primefaces 6

UI Components for JSF
Post Reply
Jssson
Posts: 4
Joined: 21 Sep 2021, 17:56

21 Sep 2021, 18:06

Hey everyone,

I've tried posting about this on stackoverflow but without any luck, so lets try here instead.

Lately I've been trying to implement some proper validation of a form that I have in my application.
The form contains a datatable, that has several different input fields with custom validators on every row. Every field is being updated by AJAX like this:

Code: Select all

<p:calendar id="lineDeliveryDate" value="#{line.deliveryDate}" converter="localDateConverter" pattern="yyyy-MM-dd" mindate="#{dateHelper.today()}">
                            <f:validator binding="#{deliveryDateValidator}" />
                            <f:attribute name="line" value="#{line}" />
                            <p:ajax event="dateSelect" process="@this" delay="500" update="@form growlInfo @([id$=nextStepBtn])" listener="#{checkoutDeliveryDateController.saveLine(line)}" />
                            <p:ajax event="change" process="@this" delay="500" update="@form  growlInfo @([id$=nextStepBtn])" listener="#{checkoutController.saveLine(line)}" />
                        </p:calendar>
I want to disable the button to go to the next step until every single field is valid. I am currently using facesContext.validationFailed to control whether the next-step button is disabled or not:

Code: Select all

  <h:commandButton value="#{messages['checkout.nextStep']}" id="nextStepBtn" disabled=" {facesContext.validationFailed}"
        title="#{tooltip}">
            <f:ajax execute="@this" />
        </h:commandButton>
The problem is that after every AJAX-call, facesContext.validationFailed fails in the following scenario:
  • Field 1 is updated with an invalid value.
    Field 2 is updated with an invalid value.
    Field 2 is updated with a valid value -> facesContext.validationFailed returns false, ignoring that field 1 is still invalid. This causes the nextbutton to be enabled, even though one field is invalid.
Therefore I draw the conclusion that facesContext.validationFailed only considers the fields currently being processed, so in my case only one field at a time. Is there a way to check if all fields are valid in my form?

I have thought about processing @form in my AJAX-calls, but that will cause every single field to be validated with every AJAX-call, slowing down the page. I'm using Primefaces 6.

Any input is appreciated, Cheers.

Melloware
Posts: 3717
Joined: 22 Apr 2013, 15:48

22 Sep 2021, 14:12

That sounds like a mess. And I don;t like entering form data in Datatables it feels like a bad UI. I think you are going to be constantly fighting issues doing it this way.
PrimeFaces Developer | PrimeFaces Extensions Developer
GitHub Profile: https://github.com/melloware
PrimeFaces Elite 13.0.0 / PF Extensions 13.0.0
PrimeReact 9.6.1

Jssson
Posts: 4
Joined: 21 Sep 2021, 17:56

22 Sep 2021, 14:53

Thanks for the feedback. Do you have any suggestions of how I could change to make it better? I've considered changing the validation so that I use resetValues in the ajax-call to reset invalid input and display a growl-message with the appropriate validation message, so that I don't have to keep track of if the "Next"-button should be enabled or not. Or alternatively, disable other inputs until the invalid input is changed.

Post Reply

Return to “PrimeFaces”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 26 guests