scroll on submittal fail

[harboradmin]

Is there a way to amend the submit function so that if the validation fails, the window scrolls up to the first error?

Example: http://beta.harborcompliance.com/registration-order-page1.php

What's happening is that a user may, in haste, scroll down and put in their contact information and fail to select the two drop-downs closer to the top of the page. They repeatedly click Submit, unaware that there is an error message closer to the top of the page. The drop-down error message is set to show onBlur.

Any help would be appreciated. I love this tool!

Thanks, Megan

[adityamenon]

I tried inspecting the sayHello (LiveValidation) object on the home page for this project, but couldn't find any property that shows all the invalid fields in an array or something like that. There's just sayHello.validations that gives a list of validation rules applied to the fields in the form. If it were an array of invalidated fields, I suppose the matter would have been simpler.

[cortopy]

@harboradmin could this work for you?

If you're also using jQuery, it's possible to scroll screen to the first input with error class using this function.

I've also added an animation to make things smoother and the window will have a margin on top of 100 (just personal preference)

$( '#yourFormSubmitButton' ).click( function() {
    var areAllValid = LiveValidation.massValidate( [ input1, input2 ] );
    $j('html, body').animate({
            scrollTop: $j ( '.LV_invalid_field').first().offset().top - 100
        }, 1000);
});