Answered by:
Reload / Refresh iframe source

Question
-
I have a iframe in my gadget that displays an external website.
When i try to reload the content of the iframe, the javascript stops.
Is there a correct way to refresh the content of a iframe when the source is a url and not a local file?Friday, October 26, 2007 12:36 PM
Answers
-
In that case, wrap a div tag with your iframe code in like this:
<div id="iframeOverviewDiv"><iframe name="iframeOverview" src="http://somesite/page.php" width="100%" height="123" scrolling="no"></iframe></div>
Then change your code to:
iframeOverviewDiv.innerHTML = '<iframe name="iframeOverview" src="http://somesite/page.php" width="100%" height="123" scrolling="no"></iframe>';
I've tested it and it works fine. However, you'll likely still get a caching issue if the page isn't outputting headers as I mentioned in my earlier post.Friday, October 26, 2007 3:50 PM
All replies
-
have you tried location.href = location.href instead of reload();?Friday, October 26, 2007 12:46 PM
-
Gadgets seem to cache the websites they are using.
This will only update if i add another gadget so that the page is requested again.Friday, October 26, 2007 1:11 PM -
They work in the same way as Internet Explorer for caching. If you have access to the page on the server, you can modify the headers so that the page isn't cached or is cached until a particular date/time.
Friday, October 26, 2007 2:15 PM -
The problem is that a simple "<object>.src = "same url";" in javascript does't do anything, cause the page is already cached, and the gadget just directs the iframe to the already cached page.
I tried to have a test page that had random numbers in it on each refresh.
The 2 gadgets i had up displayed the same random number, and when i added a 3rd gadget, all 3 gadgets displayed the same new number.
What i can't understand, is why all the examples of "<object>.location.reload();" and other refresh functions, just stops the gadgets javascript.Friday, October 26, 2007 2:46 PM -
But that's what I'm trying to say. If you visit the same page in Internet Explorer and refresh it, it will most likely give you the same random number, because IE just goes and gets the page from the cache. However, if you modified the page to output the header "Pragma: no-cache" or "Expires: Mon, 26 Jul 1997 00:00:00 GMT", then it should refresh every time you set <frame object>.location.href = <frame object>.location.href.
FYI <object>.src doesn't work with iframes in IE. Also, make sure you're referencing a frame through the window object and not it's ID:
window.frames[<NameOfFrame>].location.reload(true);
window.frames[<NameOfFrame>].location.href = window.frames[<NameOfFrame>].location.href;If you're referencing the iframe using document.getElementByID() then that is why it's breaking your script.
Friday, October 26, 2007 3:17 PM -
Andy E wrote: FYI <object>.src doesn't work with iframes in IE. Also, make sure you're referencing a frame through the window object and not it's ID:
window.frames[<NameOfFrame>].location.reload(true);
window.frames[<NameOfFrame>].location.href = window.frames[<NameOfFrame>].location.href;If you're referencing the iframe using document.getElementByID() then that is why it's breaking your script.
both these commands break the script, togheter or alone.
window.frames["iframeOverview"].href = window.frames["iframeOverview"].href;
window.frames["iframeOverview"].location.reload(true);
This is my iframe:
<iframe name="iframeOverview" src="http://somesite/page.php" width="100%" height="123" scrolling="no"></iframe>
Note that the iframe has a url and not a local page, even though that should not matter.Friday, October 26, 2007 3:37 PM -
In that case, wrap a div tag with your iframe code in like this:
<div id="iframeOverviewDiv"><iframe name="iframeOverview" src="http://somesite/page.php" width="100%" height="123" scrolling="no"></iframe></div>
Then change your code to:
iframeOverviewDiv.innerHTML = '<iframe name="iframeOverview" src="http://somesite/page.php" width="100%" height="123" scrolling="no"></iframe>';
I've tested it and it works fine. However, you'll likely still get a caching issue if the page isn't outputting headers as I mentioned in my earlier post.Friday, October 26, 2007 3:50 PM -
Thanks, that works as a very good workaround!
Caching does not seem to be a problem sinse the new innerHTML is treated as a new iframe.
Friday, October 26, 2007 4:04 PM -
Hi, I'm new to coding so could you give a complete code example of an iframe with a refresh link or button that works for this? I've been trying to piece your suggestions together and I'm not getting it to work.
I would prefer to have a button for my user to click, such as was offered in the following, but I've failed to get that to work also:
<input type="button" onclick="document.frames('testFrame').location.reload(true);" value="reload iFrame...">
I will have several iframes on each page with different src in each, so the refresh link/button needs to affect only the frame it refers to.
Thanks.- Proposed as answer by rodrif Thursday, September 23, 2010 10:48 AM
Saturday, June 6, 2009 7:44 PM -
Sorry for my mistake in the prev post!
To avoid cache use this meta tags in the parent window
<meta http-Equiv="Cache-Control" Content="no-cache">
<meta http-Equiv="Pragma" Content="no-cache">
<meta http-Equiv="Expires" Content="0">to set a new source for the iframe and reload it, you can do this:
var iframe = document.getElementById("iframe");
iframe.setAttribute("src", <your url>);note: the setAttribute changes the src and reloads the page
Thursday, September 23, 2010 10:52 AM