You could store the type of validation error in a variable (either
global or in jQuery.data), then just apply a class of "fail" to the
invalid elements.
// check for validation errors
var errorType = '';
if (required && no val) {
errorType = 'required';
}
if (email && invalid email) {
errorType = 'email';
}
// update error details for the element
$.data(e, 'validationError', errorType);
if (errorType) {
$(e).addClass('fail');
} else{
$(e).removeClass('fail');
}
// find the first invalid element
$('.fail:first')
// check the type of error
var errorType = $.data(e, 'validationError');
You could also modify errorType to be an object if you want to store
multiple validation errors per element.
On Nov 5, 3:55 pm, Pyrolupus <[EMAIL PROTECTED]> wrote:
> Thank you for the explanation and the suggestion, but elements are
> already (potentially) sporting multiple classes, due to multiple types
> of validation occurring on the fields.
>
> Oversimplified pseudo-psuedocode example:
>
> //
> // begin code
> //
> if (requiredField && $.trim(requiredField.val()).length == 0) {
> requiredField.addClass('requiredFail');
> isValid = false;
>
> }
>
> if (emailField
> && emailField.val().length > 0
> && !emailField.val().test(emailregex)) {
> emailField.addClass('validationFail');
> isValid = false;
>
> }
>
> if (!isValid) {
> //here's where we break down...
> var $firstFail = $
> ('.requiredFail,.validationFail').filter(':first');
> var elemOffset = $firstFail.offset().top;
>
> $('html,body').animate({scrollTop: elemOffset}, 400);}
>
> //
> // end code
> //
>
> There are fields that are required, and we check them for content.
> There are also fields that, if provided, must be valid content. A few
> fields fall into both categories.
>
> I am using CSS classes to distinguish between the two to make it easy
> for the designer to add new fields--just give them the "required"
> class. If it's an email field, put "email" somewhere in its ID
> attribute. Both cases get picked up, but I'm unable to get the page
> to scroll to the FIRST item that matches EITHER validation failure
> class (requiredFail or validationFail).
>
> > Your issue doesn't actually have anything to do with the filter, it's
> > the selection. $('.class1,.class2') selects all class1, then all
> > class2.
>
> This totally explains why I have the issue, and I thank you for
> describing it. I expected the select element statement to behave
> something like, "className ~= /^(?:class1|class2)$/," but it really
> operates more like, "(.class1).push(.class2)."
>
> Pyro
