PDA

View Full Version : How to refresh an Iframe



Digger3000
07-01-2007, 12:22 PM
I've been trying to figure this out for a couple days. It seems like it should be simple, but apparently, it's not. How do I refresh an Iframe with Javascript?

???
07-01-2007, 02:55 PM
I don't really know, it might have a window object of it's own but I think this will work:

var refreshIFrame = function (iframeID) {
var src = document.getElementById(iframeID).src;
document.getElementById(iframeID).src = null;
document.getElementById(iframeID).src = src;
}

Digger3000
07-01-2007, 03:13 PM
Well, I've tried this:

var a=document.getElementById("a");
a.src=a.src;

And that works, but only to a certain extent. I'll explain what I mean, so bear with me.

Let's say I have an iframe like this: <iframe src="http://google.com" name="ifram" id=a height=780 width=1075></iframe>

Now let's say that, for some reason, there's a link to yahoo.com on google.com. If I go to yahoo.com, and then try to do "a.src=a.src" then the iframe refreshes, but it goes back to google.com instead of refreshing yahoo.com.

???
07-01-2007, 03:23 PM
Oh I see, well, I'll check on W3Schools and see if there's anything else I can find.

???
07-01-2007, 03:27 PM
var refreshIFrame = function (iframeID) {
var url = document.getElementById(iframeID).contentDocument.URL;
document.getElementById(iframeID).contentDocument.URL = null;
document.getElementById(iframeID).contentDocument.URL = url;
}

There! That should work. contentDocument is like document but for the iframe, and then theres the URL. Anything that might not work?

Digger3000
07-01-2007, 03:57 PM
I looked at the firefox error console and it said this: "Error: uncaught exception: Permission denied to get property HTMLDocument.URL"

???
07-01-2007, 04:53 PM
Well for me it just said it's a read only var. But that sucks.

Digger3000
07-01-2007, 07:25 PM
I tried this:

"function refreshIFrame(iframeID) {
var a=document.getElementById(iframeID);
var url = a.contentWindow.URL;
a.contentWindow.URL = null;
a.contentWindow.URL = url;
}"

And in IE, it said "Permission Denied."

djr33
07-01-2007, 07:50 PM
Should be more simple than that.


<iframe name="test" src="a.htm" width="200" height="200"></iframe>
<a href="#" onClick="frames.test.location='b.htm';">click</a>
It works with or without the part in red, but I'm assuming that may not be the case for all browsers. Test it yourself.

That's a working chunk of html for a page, but if you just want the script itself:
framename.location='newpage.htm';

However, since you're wanting it to refresh, use [frame].src to get the current value.

Here's a function that should work:
function refreshframe(id) {
frames.id.location=frames.id.location;
}However, it doesn't seem to work for me. I've tried various combinations and it's not doing anything. Someone should know. I'm just guessing.
This does work, though, with specifying a particular frame in the script (frames.myname.location for example), so it's something about passing the name to the id variable.


Note that though you are specifying an iframe, this would work for any frame, so there is no need to specify the refresh script as for iframes.

Digger3000
07-01-2007, 09:59 PM
Is it possible that it's not working because my page and the other page are on different domains?

???
07-05-2007, 11:38 PM
Well, I was thinking, whatabout:
var refreshIframe = function (id) {
document.getElementById(id).src = document.getElementById(id).contextWindow.url;
}
Maybe?

tech_support
07-07-2007, 09:19 AM
Try this:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>iframe refresher</title>
<script type="text/javascript">
function refreshIframe(el) {
var f = document.getElementById(el)
var rsrc = f.src
f.src="about:blank"
f.src=rsrc
}
</script>
</head>

<body>
<iframe name="test" src="http://www.google.com.au/" width="200" height="200" id="test"></iframe>
<a href="#" onclick="refreshIframe('test'); return false">click</a>
</body>
</html>