Gravity Forms Scroll to Error Message after Submit

Filling out forms are the worst. Especially if you have to fill it out cause you have a complaint or if it is mandatory for work. You start tabbing through the form filling out only the necessities just so you can get to the end and submit it. And when you think you are finally at the end of it all and hit submit...the page refreshes and you are staring at the form all over again. What makes this worse if the form is super long or heaven forbid multiple pages. If you are lucky you are scrolled right to the error. If you are not so lucky at least you learned that this isn't the way forms should be and you can update forms on your website to fix this.

Insert jQuery to add scrolling after submission

jQuery( document ).bind( 'gform_post_render', function() {
    var firstError = jQuery( 'li.gfield.gfield_error:first' );
    if( firstError.length > 0 ) {
        firstError.find( 'input, select, textarea' ).eq( 0 ).focus();
        document.body.scrollTop = firstError.offset().top;
    }
} );

Add this into your custom JS file or place it in a <script></script> on the template your Gravity Form is located. You can either call this function in a jQuery(document).ready() or wrap it in a function of your own creation and call it.