Tuesday, December 27, 2011

8:28 AM

I was working with one web application and I placed a iFrame in it. I am making ajax call and updating iFrame files. Now I want to refresh only iFrame. I found many solution via Google and I tried many with my own idea to replace iFrame or load iFrame etc etc. 


But none of them works in all browsers including IE. Some of them are working in FF, some of them in other browsers. I was looking for a solution which works in all browsers. Finally I found the one which works in all browsers.

Works in FF, IE, Crome, Safari :

document.getElementById("ifr").contentWindow.location.reload(true);

Not Working :

document.getElementById("ifr").contentDocument.location.reload(true);

EX:

var fr = document.getElementById("ifr");
if(fr!=null) 
document.getElementById("previewiframe").removeChild(fr);
var iframehtml = '<iframe id="ifr" src="demo/index.php" width="300px" height="453px" style="z-index:-1;margin:auto;text-align:center; padding: 0 0 0 20px; border:none;"></iframe>';
document.getElementById("previewiframe").innerHTML = iframehtml;

Just changing contentDocument.location.reload() to contentWindow.location.reload() works fine in all browsers. It has problem in IE. iFrame reload was not working in IE but with the first code, it works in IE also. IE iFrame reloads resolved.

0 comments: