Initial thoughts on form validation with Livevalidation

I have been doing a lot of javascript programming this week, so here are what I have learned so far about live validation.

Form validation with Livevalidation

I am using a library called Live Validation, which I so far like.

Conflict with jquery when submitting

However if you are using it in conjunction with jquery, which I do, there is one conflict. When livevalidation is turned on for a field, livevalidation also takes care of the submit handler of that form, inserting itself in a chain with the original handler placed after it. In this way livevalidation can stop the submitting of a form. However in my use case I had a jquery form submit event handler set up on loading the page, and this one fired even when validation failed since it somehow managed to sneak in before livevalidation. Since my code submits another form as part of that code, that did not work out well.

Solution was to assign my code to the onsubmit handler of the form, instead of using fancy jquery event interception. Then livevalidation can then sneak in and stop the shenanigans.

An empty field with an email validator still validates

Secondly a thing that is logical on scrutiny when it comes to livevalidation, is that even if you have marked a field that it must contain a valid e-mail address, an empty field also validates.

Why? I believe it is because there is the use case that you would like to validate optional fields too. The solution is to stick two validators on the field, one for e-mail and one for at least something (Validate.Presence in livevalidation speak).

Liveavalidation tries to validate non-existing removed  fields

If you remove input fields from your form with jquery's remove(), while these inputs still have Livevalidation validators on them, Livevalidation will still remember them and refuse to submit the form if they have any validators on them that checks for empty. Solution is to go through the inputs before you remove them and do something like this:

var fieldid = $(v).attr('id');
var aField = new LiveValidation(fieldid);
aField.disable();

Calling the Livevalidation destroy() methid is not enough unless you manage to get hold of the original Livevalidation object(s) for that field, so use disable().