Jump to content

Refreshing Iframe After Receiving Parameters From Another Iframe


Recommended Posts

Hello there,

 

I have two iFrames inside an HTML Page; one is a Submission Form, the other is a Report shown as Tabular. The iFrame with the Tabular Report receives parameters once you press "Submit" on the iFrame containing the Submission Form. It works, but I have to refresh the HTML Page in order for the changes to show in the Tabular Report.

 

What I want is the iFrame containing the Tabular Report (or the entire HTML Page, either way is good) to refresh once i press "Submit" on the iFrame containing the Submission Form, so that the changes will show automatically after i send the parameters.

 

Can it be done? Any help on this matter is appreciated!

Link to post
Share on other sites

Well, I know the code exists (I looked it up at one point) to refresh just the iframe, but it requires that the iFrame be deployed from your domain and not just the Caspio URL.

 

 

But, here is the code to refresh the page the iframe is hosted on in 3 seconds, I have this deployed as a success message:

 

<body style="background-color: #E1E1E1"  onload="timedText()">

<script>
function timedText() {
    var x = document.getElementById("count");

    setTimeout(function(){ x.value="2" }, 0000);
    setTimeout(function(){ x.value="1" }, 1000);
}
</script>
<div align="center" class="row-fluid iframeplaceholder">
<h1 style="border: 1px solid #000000; width: 70%; padding-top: 1%; padding-right: 1%; padding-bottom: 1%; padding-left: 1%;">Your submission was successful, your page will refresh in... <input id="count" style="width: 15px; background-color:transparent; font-size:21px; font-family:Segoe, 'Segoe UI', 'DejaVu Sans', 'Trebuchet MS', Verdana, sans-serif; border: none; vertical-align:text-middle; height:inherit;" type="text" /> .</h1>
</div>

<script type=text/javascript>

setInterval(function ReloadParent () {
window.parent.location.reload();
},2000);

</script>

This code will also display a little countdown clock to give them a chance to see the success message and make the refresh less abrupt.

 

 

Hope this helps!

 

 

Edit: Oh! I forgot to mention that the styling on that text element can be changed to match your page's feel, it doesn't have anything to do with the codes function.

 

Edit 2: Forgot to mention you should disable the HTML editor in your message display or it will strip the body tag at the top which triggers it to run the function.

Link to post
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...