Don't jump to top of page after form...

User 2377814 Photo


Registered User
45 posts

I have a form which is placed at the bottom of a fairly long page.

Since the form will generate an invoice it's important the customer sees the second stage of the form after clicking submit as they need to check and complete their order before the form is finalised by clicking submit a second time.

After clicking submit the first time the page reloads and the customer is taken to the top of the page and then has to scroll all the way back down. Can you tell me please how Im able to stop this? and after submit is clicked the form still remains visible on the screen?

Im able to use anchors on the page if this is needed as the form already resides in an anchor named #ORDER so, mywebsite.com/price.htm#ORDER will skip immediately to the form at the bottom of the page.

Is it possible to not jump to the top of the page, but instead remain in the area of this anchor after submit?
User 187934 Photo


Senior Advisor
20,190 posts

I didn't test this, but try placing this in the head of the page that your embed code is on. Adjust the 900 to the correct position.
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script language="javascript">
$(document).ready(function() {
$('body iframe').load(function(){
$(window).scrollTo(900);
});
});
</script>
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 2377814 Photo


Registered User
45 posts

Hi Eric,
Thanks for your reply.

I have inserted this code and it works when the form is submitted for the second time - but not when the form is submitted for the first time - the first time still reloads to the top of the page.

The form generates an invoice - so the first submit brings confirmation of the order to review (where it still skips to the top), you then check your order and click submit for a second time and it then displays the custom thank you message (where the code is making the page stay in place).

Is there a way to make it remain in place for the first submit as well? My form page location is at 2850px
User 187934 Photo


Senior Advisor
20,190 posts

Are you using the built in confirmation of the form builder or are you redirecting to a url?
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 2377814 Photo


Registered User
45 posts

Im using the built in confirmation. But when you use the form to generate an invoice there's another step in between which is to confirm the order then click submit again.

So it's main screen. Submit
Confirm order. Submit
Confirmation page

Its on that second stage when the form reloads and skips back to the top of the page even with your code inserted. When it reloads to show the confirmation page its staying in place
User 187934 Photo


Senior Advisor
20,190 posts

Ok let me take a look. That payment option is going to make it a little more involved.
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 187934 Photo


Senior Advisor
20,190 posts

Ok I think I got this worked out.
In the Form builder click on "Settings" then "Payment" tab.
Now click "Confirgure Payment Page". In the window that opens paste the code below at the very top. It will go above the <center> tag that is curently at the top.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script language="javascript">$(document).ready(function() {
$('body').load(function(){
$(window).scrollTo('#fb_confirm_inline');
});
});</script>
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 2377814 Photo


Registered User
45 posts

Thanks Eric,

Ive inserted the code above into the suggested location, saved the file and re exported it, but unfortunately it's not working. :(

After the first submit it's still reloading to the top of the page instead of remaining at the same level as the form.

Do I need to change some code within the above?
User 187934 Photo


Senior Advisor
20,190 posts

Did you remove the first one?
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 2377814 Photo


Registered User
45 posts

I've tried it with the first code in place and without the first code in place. Both it still jumps to the top of the page when submit is clicked for the first time

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.