I'm trying to write a custom view for a form which allows the
condition of the form to be represented independently of error
messages, by updating the class on another element accordingly
whenever the form is changed. So, I have the following code:

$('#myform').change(function()
{
        switch ($(this).valid())
        {
                case true:
                        $('#formstate').removeClass();
                        $('#formstate').addClass('ready');
                        $('#formstate label').text('Form is valid');
                        break;
                case false:
                        $('#formstate').removeClass();
                        $('#formstate').addClass('errors');
                        $('#formstate label').text('Form has errors.');
                        break;
                default:
                        $('#formstate').removeClass();
                        $('#formstate').addClass('incomplete');
                        $('#formstate label').text('Form is incomplete.');
                        break;
        }
}

(I should add, I'm not sure if valid() can ever return anything except
true/false, so the default condition may actually be redundant; I'd
certainly like it if the method returned a third state to represent a
form that's in progress but doesn't yet have any errors).

The problem I have is that it appears that by calling the valid()
method, every field in the form is instantly validated based on its
current state, and any that are invalid have their respective error
messages displayed. This is very ugly as it will happen as soon as the
user leaves focus on the first element, causing error messages to
appear next to fields they've not yet had chance to type into (for
instance, I have a pair of password elements for a user registration
form, whose values must be identical - as soon as the first password
element loses focus, an error is displayed saying that the passwords
don't match).

What I'd like is to be able to sample the state of the form /so far/ -
i.e. only validate elements which have received input, and ignore the
rest. It would be even better if the method could return the third
state for incomplete so that forms 'in progress' aren't flagged as
invalid (and they're not strictly valid either).

So, suggestions? Is this something the Validation plugin supports
already? Or will it need to be modified to support it?

Reply via email to