View The Space is Hiring


View The Space is Hiring!

Tuesday, September 13, 2011

ScrollTo the first rails client_side_validation with JQuery

I was using the amazing client_side_validations gem with an extremely large form. Everything was working perfectly but since this was a large form, the inline validation errors were not on the screen when the user hit submit. As a result, it just appeared as though the form was not working. To fix this, we used the jquery ScrollTo plugin and client_side_validations callbacks to scroll to the first validation error:


clientSideValidations.callbacks.form.fail = function(form, eventData) {
$.scrollTo('.error', 500, {offset:{left:0,top:-25}} );
};
view raw scroll_to_first_error.js hosted with ❤ by GitHub
Posted by at

2 comments:

  1. Jane LuoJune 28, 2013 at 9:01 AM

    Hello!

    I'm very new to web development and this gem seems super useful but I'm confused as how to utilize the ClientSideValidations.callbacks.form.fail and link it up to the submit button. My design was to block submission until all errors are removed and it sounds like thats what you had in mind to. Thank you!

    ReplyDelete

Subscribe to: Post Comments (Atom)