Tagged: , , ,

Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • June 17, 2015 at 9:34 pm #460982
    Sandy

    When a form is successfully submitted, the success message shows at the top of the page – all good. The problem is that you can’t see the message unless you know to scroll to the top of the page. When the submit button is clicked for a correctly completed form, I would like the page to auto auto scroll so the message can be seen. How is this accomplished?

    June 18, 2015 at 6:14 am #461090
    Josue

    Hi,

    Can you post the link to your website please? the form should disappear once submitted.

    Regards,
    Josue

    June 18, 2015 at 9:04 pm #461578
    Sandy

    Yes, the form disappears, but the success message is way up top it’s not seen without scrolling up.

    June 18, 2015 at 9:04 pm #461581
    Sandy
    This reply has been marked as private.
    June 19, 2015 at 3:22 am #461656
    Josue

    Hi,

    Try adding this at the very end of your theme / child theme functions.php file:

    function add_custom_script(){
?>
<script>
(function($){
    $(window).load(function() {
    	$(".avia_ajax_form input.button").on('click', function(){ $("a#scroll-top-link").trigger('click'); });
    });
})(jQuery);
</script>
<?php
}
add_action('wp_footer', 'add_custom_script');

    Regards,
    Josue

    June 25, 2015 at 8:30 pm #464687
    Sandy

    It does fix the scrolling issue when the form is successfully completed. But, it scrolls up to the top every single time the submit button is selected, which is a little confusing/annoying to a user. (I.e when one field is incorrect, it scrolls by it all the way to the top. The user would have no idea why that happened.)

    June 27, 2015 at 12:29 pm #465223
    Josue

    Hi!

    I have an idea that could do the trick, can you please create us a WordPress administrator account? post it here as a private reply.

    Regards,
    Josue

    June 30, 2015 at 5:55 pm #466588
    Sandy

    OK.

    July 1, 2015 at 7:49 pm #467199
    Josue

    Check it now.

    Regards,
    Josue

    July 1, 2015 at 8:02 pm #467211
    Sandy

    That works! Thanks. What is the code and/or other change? I don’t want to loose it or break the site when the theme or anything else is upgraded. Plus, I would like to have other forms look and function the same for consistency.

    July 1, 2015 at 8:35 pm #467228
    Josue

    There’s a Code Block before the form if you edit that Page, you can copy that to other forms to replicate the effect, other than that i modified the code in functions.php.

    Also, i’d suggest you transition a Child Theme to store those custom functions you have in Enfold functions.php, they will be lost if you update the theme.

    Cheers!
    Josue

    July 7, 2015 at 5:12 pm #469821
    Sandy

    Thanks, resolved. Can you refer me to someone who can set up the child theme for me, and move the customize functions to it?

    July 7, 2015 at 5:58 pm #469870
    Josue

    Hello!

    It’s not really a hard task but if you want someone to do it for you, you can request a customisation quote from a third-party provider here.

    Regards,
    Josue

    July 7, 2015 at 6:06 pm #469875
    Sandy

    Thanks.

  • Author
    Posts
Viewing 14 posts - 1 through 14 (of 14 total)
  • The topic ‘Form success message isn't seen unless you scroll’ is closed to new replies.