28

I am looking for a solution (code) how to redirect user to a custom thank you page (not default Google's) after submitting the form with Old Google Form.

<iframe name="hidden_iframe"
        id="hidden_iframe"
        style="display:none;"
        onload="if(submitted){window.location='http:/...yourthankyoupage.htm';}">
</iframe>
<form action="https://spreadsheets.google.com/formResponse?formkey=....."
      method="post"
      target="hidden_iframe"
      onsubmit="submitted=true;">

This code is not working. At least not for me. Any suggestions?

Rubén
  • 34,714
  • 9
  • 70
  • 166
Boco
  • 949
  • 6
  • 16
  • 22

3 Answers3

40

is this a form that you've styled yourself? some good reading here: http://morning.am/tutorials/how-to-style-google-forms/

basically its... replace

<form action="YOUR-EMBEDDED-GOOGLE-SPREADSHEET-LINK" method="POST">

with

<script type="text/javascript">var submitted=false;</script>
    <iframe name="hidden_iframe" id="hidden_iframe" style="display:none;"     
onload="if(submitted) {window.location='whateveryourredirectis.html';}"></iframe>
      <form action="YOUR-EMBEDDED-GOOGLE-SPREADSHEET-LINK" method="post" target="hidden_iframe" 
onsubmit="submitted=true;">
ajcw
  • 23,604
  • 6
  • 30
  • 47
tronjavolta
  • 737
  • 5
  • 16
  • 3
    This works in Chrome and IE only if you put the code between the form tags. –  Dec 13 '12 at 20:57
  • It is not working for me. EDIT, got it to work, follow Brians suggestion – AustinT Dec 18 '12 at 04:09
  • 1
    The http://morningcopy.com.au/tutorials/how-to-style-google-forms link is broken. It looks like it should be http://morning.am/tutorials/how-to-style-google-forms, but I lack the POWER to edit your post. – Brian Stinar Jun 18 '13 at 20:19
  • @BrianStinar What should I do if I want to show a hidden div tag with a success message? I don't want to redirect to another page. I just want to show a message of successful submission in place of the text box and submit button. Is it possible by using only javascript? – Ashutosh Dave Feb 10 '14 at 17:45
  • @Ashutosh I did something similar to this. I what I did was modify my onsubmit() method to perform all form validation (I disabled all Google's Google Form validation) and do my hide/show logic right before I submitted Google's form. I wasn't able to find anything that Google returned true or false that I could check, before this. So it is possible that Google rejects the form, but I show the success div. Setup a fiddle for your problem, and I'll take a look at it if this doesn't make sense. – Brian Stinar Feb 21 '14 at 01:20
  • 1
    @BrianStinar This is the fiddle that worked for me http://jsfiddle.net/Ashuu/738GD/ Actually, I want to implement email validation before submitting to Google Forms so I have used webshims but email validation doesn't work properly. – Ashutosh Dave Feb 22 '14 at 19:28
  • @AshutoshDave Maybe the following page would help for the hidden div tag: http://www.sweetsindesign.com/web/customizing-google-form-confirmation-page – Jean-Francois T. Mar 30 '15 at 05:27
  • Nov. 2019 This worked for me. I have a custom form that did not require any input validation. Thank you – Hblegg Nov 26 '19 at 15:38
5

Sneaky Sheep version 2 can automatically generate the necessary html to embed the form in your website. It preserves the stylesheets of your form.

Or, if you're using the original version of Sneaky Sheep, make sure to append the proper domain name in the styles section to get the stylesheets.

For example, I had to change

<link href='/static/forms/client/css/1234-formview_ltr.css' type='text/css' rel='stylesheet'>

to

<link href='https://docs.google.com/static/forms/client/css/3904611051-formview_ltr.css' type='text/css' rel='stylesheet'>
sgryzko
  • 2,397
  • 2
  • 22
  • 37
Bibek Shrestha
  • 32,848
  • 7
  • 31
  • 34
0

You could also consider other options. After putting countless hours on trying to crank Google Forms to suit my needs, I had to give up. I tried both the morning.am tutorial as advised in the first answer, and the code generator in the other one. In both cases, I copied the Google Forms code to my own web page but ended up breaking the Submit button. This is also commented by other users on Sneaky Sheep code generator.

Apparently Google Forms is not designed to provide any customized feedback for the person who filled in the form. You could have a static text or even link on the confirmation page, but in my use case, the content of the confirmation page depends on the user's input.

My current workaround is to ditch Google Forms entirely, and build the query form on my own. I'm using a bootstrap form generator, for example http://bootsnipp.com/forms. The downside is that I'll have to spend more time on tweaking the visual appearance of the form myself. I'll update this answer if a better solution comes around.

Community
  • 1
  • 1
Juuso Ohtonen
  • 8,826
  • 9
  • 65
  • 98