judgegem / judge

Client-side form validation for Rails
MIT License
256 stars 41 forks source link

Form sent even when validation fails if use only uniqueness (ajax) validation #20

Closed Vadorequest closed 10 years ago

Vadorequest commented 10 years ago

I use a custom script to bind events and run the validation client side dynamically. https://github.com/Vadorequest/judge-bootstrap3-helper

Here is the problem:

It looks like if we perform Ajax validation (uniqueness) the 'uniqueness' rule is applied before the 'required' rule and because the required rule seems to be waiting for the 'uniqueness' rule response then the ajax response (network latency) is received after the form was sent, because there is no errors at the time (in the DOM) the error is generated after. But the form was considered as valid and sent.

This happens when there is only the uniqueness validation to run and no other validation.

So I'm looking for a workaround/fix about that, because the user could just click on send and the form would be sent, thinking there is no errors while the Ajax request is in process. It's a special case because if there is another input that fails at the validation then it works fine, also, if the validation is performed before (blur/input events)to click on the send button then the validation fails (required) and the form is not send.

Of course, the issue is strongly linked to the way my script works, I'm asking if there is a way to fix this by maybe run validation such as required before uniqueness or another workaround.

Thanks.

joecorcoran commented 10 years ago

I'm afraid there's no way to specify the order in which validations are performed. Judge has a queueing system to ensure that validation results are delivered after all ajax requests are completed.

If you're worried about a user submitting the form before the client-side validation is finished, you could consider disabling the submit button during validation, but I must warn you that aiming for total control over the user like this will always fail in some way.

Client-side validation is only supposed to be a guide for the user – it's not intended to remove all possibility of validation errors after form submission. The database, after all, is the real source of truth.

Vadorequest commented 10 years ago

Yeah, I know, it's just that the form is in several steps and the model will perform final validation only when the last step is sent, and in my case this happens at the first step. With a "normal" form the validation would just have reloaded the form page, but not with steps.​

In this special case disable the submit button is not a bad idea, I'll give a try. Thanks.

Vadorequest commented 10 years ago

I fix it dynamically by checking if the validation was successful on the element on the form.submit event. If the success class is not applied to the input then that means that the validation didn't run, and I preventDefault() in this case.