6

I'm using jQuery Validate and trying to move (or scroll) to the top of the page when an error is found. I've added the focusInvalid option to stop focusing on a field with an error, but can't figure out how to move to the top of the page (as at the top of the page, my error container is visible).

A simplified version of my script is below, and thanks for any help with this.

$(".event-form").validate({
  errorContainer: ".error-container",
  errorLabelContainer: ".error-container ul",
  wrapper: "li",
  focusInvalid: false,
  ignore: "",
  rules: {
    title: { required: true }
  },
  messages: {
    title: "You must enter the title"
  }
});

1 Answer 1

7
$(".event-form").validate({
 errorContainer: ".error-container",
  errorLabelContainer: ".error-container ul",
  wrapper: "li",
  focusInvalid: false,
  ignore: "",
  rules: {
    title: { required: true }
  },
  messages: {
    title: "You must enter the title"
  },
    invalidHandler: function(form, validator) {
        var errors = validator.numberOfInvalids();
        if (errors) {
              $("html, body").animate({ scrollTop: 0 }, "fast");
        }
    }
})
0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.