Jump to content

Survey Redirect-upon-Completion isn't working

Recommended Posts

Hello!

I have created a Code Block on a page of my website so I can insert a survey (from the website forms.app). The code provided by the forms website is:

<iframe id="" allowtransparency="true" allowfullscreen="true" allow="geolocation; microphone; camera" src="https://my.forms.app/form/61a320417d2e520c5456fd3b" frameborder="0" style="width: 1px; min-width:100%; height:500px; border:none;"></iframe>

At the end of it, users should be redirected to a Thank You page (also on my site) but it doesn't work, even though the form does say the user will be redirected. The page doesn't change and the survey goes back to its 1st page.

I imagine it's because the Redirect-upon-Completion is in the form's settings (i.e. in a block inside the page) rather than in the page settings itself? Or maybe it's something else entirely.

Any help appreciated! (Note: I'm a smart guy but also a complete beginner at coding so I can only make use of detailed instructions when coding is involved.)

Thanks!

Link to comment
  • Replies 10
  • Created
  • Last Reply

Top Posters In This Topic

5 hours ago, fabianmoreno01 said:

Hello!

I have created a Code Block on a page of my website so I can insert a survey (from the website forms.app). The code provided by the forms website is:

<iframe id="" allowtransparency="true" allowfullscreen="true" allow="geolocation; microphone; camera" src="https://my.forms.app/form/61a320417d2e520c5456fd3b" frameborder="0" style="width: 1px; min-width:100%; height:500px; border:none;"></iframe>

At the end of it, users should be redirected to a Thank You page (also on my site) but it doesn't work, even though the form does say the user will be redirected. The page doesn't change and the survey goes back to its 1st page.

I imagine it's because the Redirect-upon-Completion is in the form's settings (i.e. in a block inside the page) rather than in the page settings itself? Or maybe it's something else entirely.

Any help appreciated! (Note: I'm a smart guy but also a complete beginner at coding so I can only make use of detailed instructions when coding is involved.)

Thanks!

Hi It's a simple fix , I did wrote a quick fix for you please do change your form code to the following and test if it works or not.

<iframe id="" allowtransparency="true" allowfullscreen="true" allow="geolocation; microphone; camera" src="https://my.forms.app/form/61a320417d2e520c5456fd3b" frameborder="0" style="width: 1px; min-width:100%; height:500px; border:none;"></iframe>

<script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
<script>
$('.submit-button').click(function(){ window.location = 'https://www.fabianmoreno.net/thank-you'});
</script>

if it fixes the issue ,please do mark it as solved. 

Link to comment
4 hours ago, fabianmoreno01 said:

Thanks @humxahafeex , I changed the code but it's still not working...
(Also, I don't know if this plays a role, but I do have a piece of code in the page itself to prevent the header and footer from appearing.)

My Bad , Please try this one , header and footer code is not a issue.

Quote
Quote
<iframe id="" allowtransparency="true" allowfullscreen="true" allow="geolocation; microphone; camera" src="https://my.forms.app/form/61a320417d2e520c5456fd3b" frameborder="0" style="width: 1px; min-width:100%; height:500px; border:none;"></iframe>
<script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
<script>
$(document).ready(function() {
    $('.submit-button').click(function(){ window.location = 'https://www.fabianmoreno.net/thank-you'});
});
</script>

please check and let me know if it still shows no result.

Link to comment
On 5/7/2022 at 5:51 PM, fabianmoreno01 said:

I have created a Code Block on a page of my website so I can insert a survey [using an iFrame]. At the end of it, users should be redirected to a Thank You page but it doesn't work.

This is because the form is within an iFrame. For security reasons, the form within the iFrame cannot take control of your browser and redirect the user.

Instead of placing the form within an iFrame using code, you may want to consider sending the user directly to the external form page (https://my.forms.app/form/61a320417d2e520c5456fd3b). You could do this using a link or a Button Block. The user will then be successfully redirected back to your site when they have completed the form.

Does this help? Please give feedback by clicking an icon below  ⬇️

Improve your online store with our extensions.
About: Squarespace Circle Leader since 2017. I value honesty, transparency, appreciation and great design ♥.
Work: Squarespace Developer and founder of SF Digital, building the features Squarespace didn't include™.
Content: Links in my posts may refer to SF Digital products or may be affiliate links.

Buy me a coffee

Link to comment
5 hours ago, paul2009 said:

This is because the form is within an iFrame. For security reasons, the form within the iFrame cannot take control of your browser and redirect the user.

Instead of placing the form within an iFrame using code, you may want to consider sending the user directly to the external form page (https://my.forms.app/form/61a320417d2e520c5456fd3b). You could do this using a link or a Button Block. The user will then be successfully redirected back to your site when they have completed the form.

Does this help? Please give feedback by clicking an icon below  ⬇️

Hey Paul, thanks for your answer! Is there any way to solve this while keeping the form on my site? I'd like to keep it at this address and leave the disclaimer at the bottom of the page...

Maybe one of these could be of use?
- https://stackoverflow.com/questions/580669/redirect-parent-window-from-an-iframe-action
- https://htmldom.dev/communication-between-an-iframe-and-its-parent-window/
- https://stackfame.com/access-parent-of-iframe-javascript
- https://help.alchemer.com/help/break-out-of-iframe
- https://stackoverflow.com/questions/11332247/redirect-from-iframe-using-javascript-or-jquery?noredirect=1&lq=1
- https://stackoverflow.com/questions/1378433/how-do-i-implement-cross-domain-url-access-from-an-iframe-using-javascript/1378456#1378456

(Note: I have no access to the code of the form itself, I can only tweak it in the code block on Squarespace.)

Edited by fabianmoreno01
Inserting additional links
Link to comment
21 hours ago, fabianmoreno01 said:

Is there any way to solve this while keeping the form on my site?

This isn't something you can do from Squarespace. You’ll need some different code from the third party. 

Edited by paul2009

Improve your online store with our extensions.
About: Squarespace Circle Leader since 2017. I value honesty, transparency, appreciation and great design ♥.
Work: Squarespace Developer and founder of SF Digital, building the features Squarespace didn't include™.
Content: Links in my posts may refer to SF Digital products or may be affiliate links.

Buy me a coffee

Link to comment

@paul2009 and @humxahafeex, actually there was a way to fix it and redirect from within the iFrame. The following piece of code was provided by the forms website (I replaced the form ID with --- in the code here). It doesn't seem to always work, but it sometimes does. I'm not sure yet why it's still inconsistent.

 

<div formsappId="---"></div>
            <script src="https://my.forms.app/static/iframe.js" type="text/javascript"></script>
            <script>
                new formsapp('---', {
                    width: '100%',
                    height: 'formHeight'
                });
            </script>

 

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.