Scroll to top of form


I’m wanting to be able to scroll to the top of a form automatically if upon submission there are error messages displayed. Currently unless someone scrolls to the top of the form they may not know.

Any coding suggestions?

View Replies:
OpenWebSolutions replied on at Permalink Reply

I've had the same issue with an external_form. One solution that worked for me in the end was to simply fade out the content above the form (which is wrapped in a div with the id 'wrapper_main') when $success or $error are set:

    if (!empty($success) || !empty($error)) { ?>
            $(function () {
    <?php } ?>

Another solution might be to use bootstrap's display properties if $succes or $error are set ('.d-none')?
mnakalay replied on at Permalink Reply
Alternatively, if you're using Express forms, you could have a look at my package Ajax for Express Forms.

Among other things it makes the error messages much nicer and it scrolls to the error (or success) message after submission.

There's a quick video on the market page that shows it all
linuxoid replied on at Permalink Reply
.done(function(response) {
    if (response['status'] === 'whatever') {
        $('html, body').animate({scrollTop: 0}, 300);