How to auto refresh a page on an embedded google form submit

2.4k Views Asked by At

Note upfront: I do not have any experience using scripts but only some basic HTML and PHP skills.

I would like a page on my google site to refresh automatically as soon as the embedded google form was submitted. This to instantly display the embedded and updated google form results after the button is clicked without the visitor having to reload the page manually. (like you would have for any online poll)

My form sheet is updating perfectly but I have not yet found an example or tutorial how to make a page refresh work for the google site with an embedded google form when the submit button is clicked. I hope someone can help me by providing an example on how to make this work. Preferably I would like to use an embedded google form rather than having to create a separate PHP form loading into google forms what could be an alternative. Thanks.

Below the HTML as I can see it on my Google page. I would need a trigger I guess from these embedded forms to refresh the page on submit. I just have no idea on how to get this done.

<div>
<div style="text-align:left">
<div><img src="https://www.google.com/chart?chc=sites&amp;cht=d&amp;chdp=sites&amp;chl=%5B%5BSpreadsheet+form'%3D20'f%5Cv'a%5C%3D0'10'%3D499'0'dim'%5Cbox1'b%5CF6F6F6'fC%5CF6F6F6'eC%5C0'sk'%5C%5B%22test+int+sheet%22'%5D'a%5CV%5C%3D12'f%5C%5DV%5Cta%5C%3D10'%3D0'%3D500'%3D397'dim'%5C%3D10'%3D10'%3D500'%3D397'vdim'%5Cbox1'b%5Cva%5CF6F6F6'fC%5CC8C8C8'eC%5C'a%5C%5Do%5CLauto'f%5C&amp;sig=5VZGSIULBu8sSdf833qiLWVDcx8" data-origsrc="1VACx4d2pJEZlvAezbO9Gnh_nX3nIPwSJ4iCNjEmCiUM" data-type="spreadsheet-form" data-props="align:center;borderTitle:test int sheet;doctype:freebird;height:400;objectTitle:test int sheet;showBorder:false;showBorderTitle:false;wrap:false;" width="500" height="400" style="display:block;margin:5px auto;text-align:center;"></div>
<br>
</div>
<div style="text-align:left"><img src="https://www.google.com/chart?chc=sites&amp;cht=d&amp;chdp=sites&amp;chl=%5B%5BGoogle+Gadget'%3D20'f%5Cv'a%5C%3D0'10'%3D499'0'dim'%5Cbox1'b%5CF6F6F6'fC%5CF6F6F6'eC%5C0'sk'%5C%5B%22Include+gadget+(iframe)%22'%5D'a%5CV%5C%3D12'f%5C%5DV%5Cta%5C%3D10'%3D0'%3D500'%3D397'dim'%5C%3D10'%3D10'%3D500'%3D397'vdim'%5Cbox1'b%5Cva%5CF6F6F6'fC%5CC8C8C8'eC%5C'a%5C%5Do%5CLauto'f%5C&amp;sig=t6_Deqv8rgMQCB28aqz1n9MoVTU" data-igsrc="http://164.gmodules.com/ig/ifr?mid=164&amp;synd=trogedit&amp;url=http%3A%2F%2Fhosting.gmodules.com%2Fig%2Fgadgets%2Ffile%2F106581606564100174314%2Fiframe.xml&amp;up_iframeURL=https%3A%2F%2Fdocs.google.com%2Fspreadsheets%2Fd%2F1g2cGeavUciTy6po7_DXPXMNqC1fqTTROHRoTnsafFfM%2Fpubhtml%3Fgid%3D754672963%26single%3Dtrue&amp;up_scroll=no&amp;h=400&amp;w=100%25" data-type="ggs-gadget" data-props="align:center;borderTitle:Include gadget (iframe);height:400;igsrc:http#58//164.gmodules.com/ig/ifr?mid=164&amp;synd=trogedit&amp;url=http%3A%2F%2Fhosting.gmodules.com%2Fig%2Fgadgets%2Ffile%2F106581606564100174314%2Fiframe.xml&amp;up_iframeURL=https%3A%2F%2Fdocs.google.com%2Fspreadsheets%2Fd%2F1g2cGeavUciTy6po7_DXPXMNqC1fqTTROHRoTnsafFfM%2Fpubhtml%3Fgid%3D754672963%26single%3Dtrue&amp;up_scroll=no&amp;h=400&amp;w=100%25;mid:164;scrolling:no;showBorder:false;showBorderTitle:null;spec:http#58//hosting.gmodules.com/ig/gadgets/file/106581606564100174314/iframe.xml;up_iframeURL:https#58//docs.google.com/spreadsheets/d/1g2cGeavUciTy6po7_DXPXMNqC1fqTTROHRoTnsafFfM/pubhtml?gid=754672963&amp;single=true;up_scroll:no;view:default;width:100%;wrap:false;" width="500" height="400" style="display:block;margin:5px auto;text-align:center;" class="igm"></div>
<div style="text-align:left"><br>
</div>
<div style="text-align:center">
<div></div>
<br>
</div>
<div style="text-align:left">
<div style="text-align:center"><br>
</div>
<div style="text-align:center"><br>
</div>
<br>
</div>
</div>
1

There are 1 best solutions below

1
On

I'm sorry to be the annunciator of a such bad news but that's impossible. As your code show, you are actually using a google Site to display your google form. The line:

<img src="https://www.google.com/chart?chc=sites&amp;cht=d&amp;...

IS the way google tell you there is a google form in this page when you hit the button to get the source code. In other words: google don't let you put whatever you want in a google site. It's impossible to add some JS code that will be fired when the user submit the form. Even if you host your form in something else than a google Site, you won't have this ability, as the form himself will be displayed in an iframe that can't be modified by external scripts. This is an hard limitation of Google Form, the only workaround that you may use is to write to the user in the confirmation message of the form that he now need to reload the page or go to an other link.