JavaScript - How To Refresh Iframe And Parent Page

Hello everyone,
I have a page. In that page is an iframe, lets name it 'A'. inside A there is another iframe 'B'. there is a link on that page which on click opens a popup. In that pop up, there is actually a document upload facility. Now i want that after every upload (onSubmit), iframe A should refresh.

have done it many times but today its not working.

Code:

function validate() {	
(window.parent.opener.location.href)=(window.parent.opener.location.href);
		window.parent.opener.location.reload(true);// this is tried as well

}

Can some one please help. it always refreshes only B.

Thanks

I have used iframes for my site and found various javascripts so when a person clicks on say the audio page he http://www.krillmeed.com/index.html
it takes them to the audio page but will load it into the index.html page. The problem is, especially with search engines, to point to that page, this is what the URL looks like to send someone to that page:
http://www.krillmeed.com/?frame=0&sr...m%2Faudio.html
which is not very clean at all, this is the javascript that i found that at least works:

Child iframe script:

Code:

<script type="text/javascript">
(function(){
	var qstr = '?frame=0&src=' + encodeURIComponent(location.href),
	lre = new RegExp('^' + location.protocol + '//' + location.hostname + '(()|(/)|(/index.html)|(/index.php))(()|(\\' + qstr + '))$');
	if (!lre.test(parent.location.href)){
		top.location.href = '/' + qstr;
	}
})();
</script>

Parent iframe Script:

Code:

<script type="text/javascript">
(function(){
	function getQval(n) {
		if(typeof n !== 'string'){
			return null;
		}
		var r = new RegExp('[?&;]' + n + '=([^&;#]*)'), m = location.search;
		return (m = r.exec(m))? unescape(m[1]) : null;
	}
	var f = getQval('frame'), s = getQval('src');
	if(f && frames[f] && s && s.indexOf(location.protocol + '//' + location.hostname + '/') === 0){
		frames[f].location.href = s;
	}
})();
</script>

Is there a "cleaner" way of doing this? This was an old code, i have yet to find a more modern one. Thank you in advance.

Hey guys,

Been searching on google for two days now, without a valid answer. I'm NEW to javascript, so I need some good help on this haha. I am using the following little piece of code to open a popup window:

Code:

<SCRIPT LANGUAGE='JAVASCRIPT' TYPE='TEXT/JAVASCRIPT'>
 <!--
var win=null;
function NewWindow(mypage,myname,w,h,pos,infocus){
if(pos=="random"){myleft=(screen.width)?Math.floor(Math.random()*(screen.width-w)):100;mytop=(screen.height)?Math.floor(Math.random()*((screen.height-h)-75)):100;}
if(pos=="center"){myleft=(screen.width)?(screen.width-w)/2:100;mytop=(screen.height)?(screen.height-h)/2:100;}
else if((pos!='center' && pos!="random") || pos==null){myleft=0;mytop=20}
settings="width=" + w + ",height=" + h + ",top=" + mytop + ",left=" + myleft + ",scrollbars=no,location=no,directories=no,status=no,menubar=no,toolbar=no,resizable=no";win=window.open(mypage,myname,settings);
win.focus();}
// -->
</script>

The actual link to open the popup is like this:

Code:

<a href="javascript:NewWindow('upload.php','popup','550','252','center','front');">Open the popup</a>

What I am opening is, an upload page to upload an image (PHP / AJAX). Once the upload is complete and I close the window, I need the parent window (the index page which the link to open the popup is on) to be refreshed, so you can see that the file has been successfully uploaded. Does anyone have a clue how I would fix this?

If I need to use another code to open the popup, that's fine, I just need help on how to fix this, since I haven't been able to find the answer myself.

Thanks in advance!

I'm using submodal-1.6 for popup.

When the popup closes I wanted parent page to refresh.I've tried the following
window.opener.location.load();
window.opener.location.load(true);
location.load();
window.parent.location.reload();

All works for IE, but when coming to mozilla ,firefox the refresh is a step delayed, i.e when I open my popup to add an itme to my cart on parent page ,for the first time it does not show anything , but when I try to add another item , the first one shows.

Any advice would be really great.

Hello to all and thanks in advance for my help. I know this has been posted in different places on the web but I have found no solid solution. Here is my problem:

I have an iframe the loads up a page on a remote server (out of my hands) and when I send certain information to it, the page redirects my entire site to their 404 page. I need to prevent this from happening so I engaged in much research and found this... temporary fix:

Code:

<script>
// No redirection! 
var prevent_bust = 0  
window.onbeforeunload = function() { prevent_bust++ }  
setInterval(function() {  
  if (prevent_bust > 0) {  
    prevent_bust -= 2
    window.top.location = 'http://www.mysite.com/my404.html'
  }  
}, 1)
</script>

What this code does, is that every time the unload of a page happens, it will redirect me to my404.html and this does solve the problem of the iframe trying to redirect my entire site but anytime a user tried to go to a new website by typing it in the address bar, they are redirected to my404.html.

Is there another solution for me so that the page within the iframe cannot redirect the parent page?

Dear Madam/Sir,
I would greatly appreciate any help.
I am working on this site: http://www.pathology.ubc.ca/Path_UBC...Professor.html. The list of names on the right hand side is conencted to the iframe, left hand side. By clicking on individual name the eprofile is populated in the iframe. Everything works fine but what I would like to add is some kind of extention to the url so we can externaly link directly to each these profiles.

Please let me know if this is something that can be done?

Many thanks,
Debbie

Sorry my bad, but im stuck again. I have tried to search in hours, but i cant find the answer. I think you the pro coders will see the code directly.

I have an webbpage, and in the middle of it there is an iframe to a php site. So i have used this code, so after some seconds the iframe will send the guest to another page.
<meta http-equiv="refresh" traget="_top" content="5 url=http://mypage.com"/>

But the thing is that i want the WHOLE page to reload, and go to that page after 5 seconds (we can say).

With that code, only the iframe are going to another page. Is it possible to make the whole page send the user after some seconds, to another page and not only the iframe?

I'm working on a upload script that uses javascript, and a hidden iframe to upload the files. It all works up until the iframe finishes and needs to send the javascript function call back to the parent page, nothing happens, when it should hide the upload progress bar.

I've searched and searched for the awnser, along with trying different alternative to window.top.window, such as window.top, parent, and parent.document and so far nothing has worked, I've even tried the onLoad on the iframe with no success.

Parent Page function:
Code:

function stopUpload(success, ups, file)
 {
  var result = '';
  var uploaded = '0';

  if (success == 1)
  {
   result = '<span class="msg">The file was uploaded successfully!<\/span><br>';
   uploaded = uploaded ++;
   
   if (uploaded == document.getElementById('numflowers').value)
   {
    document.getElementById(finish).style.display = 'block';
   }
  }
  else if (success == 2)
  {
   result = '<span class="msg">There was an error during file upload! The file has a size of 0<\/span><br> File: <input name="ufile[]" id="ufile[]" type="file" size="30"> <input type="submit" name="submitBtn" value="Upload">';
  }
  else if (success == 3)
  {
   result = '<span class="msg"> We only allow .png, .jpg, .gif, .zip, .rar, and .7z files to be uploaded. If you think we should allow other please make a suggestion on the forums.<\/span><br> File: <input name="ufile[]" id="ufile[]" type="file" size="30"> <input type="submit" name="submitBtn" value="Upload">';
  }
  var uploadp = "upload_process" + ups; 
  var uploadf = "upload_form" + ups; 

  document.getElementById('uploadp').style.display = 'none';
  document.getElementById('uploadf').innerHTML = 'result';
  document.getElementById('uploadf').style.display = 'block';      
 }

Function call inside iframe (example)
Code:

window.top.window.stopUpload(3, 1, test.txt)

Thanks for the help.

Alright straight to the point I have a link on the parent page of my site.

<a href="javascript: scontrols.expandit(0)">View Info</a>

I would like to be able to some how call that from the iframe.

I am just getting into java script and haven't been able to figure it out.

thank you for any help you can provide.

What line of javascript can I use to submit a form that's inside an iFrame?

Here are a couple of failed attempts:

Code:

document.getElementById('captcha_iframe').forms['reserve_booth_space'].submit();

window.frames['captcha_iframe'].forms['reserve_booth_space'].submit();

I have a page with 2 iframes

how can I make it that if they submit on the first iframe - it should refresh the second iframe?

Well first off all I would appricate any help that you could give me because I've been looking all over the internet for the solution without any result.

So off to my problem, I made this text-based online game and let's say the user does a crime, he did this crime 17:04:30 and has to wait till 17:06:30 before he can do a crime again (this is printed in the MySQL database).
Getting the value from the database and changing it into the right format mm:ss is no problem. The problem comes to when its about refreshing... I've tried meta refresh and javascript location.refresh with good results, i sat the timer to 1 sec and it refreshed.
The problem comes to when it refresh the mouse cursor and the tab (in firefox and chrome) gets that look, like when u refresh a page normally u can see an hourglass and all that. Is there anyway to disable that? And i think it really slows the browser down after a while (because after like 30 min or more firefox used 600 mb of my RAM).

So yeah here's my Iframe code:

Code:

print <<<ENDHTML
<IFrame Src= "right_timer.php" Scrolling=No Frameborder=0 
Marginheight=0 Marginwidth=0 Width=100% Height=160> 
  <p>Your browser does not support iframes.</p>
</iframe>

Also here's the right_timer.php:

Code:

<?php
  include("config.php");
  $dbres = mysql_query("SELECT *,UNIX_TIMESTAMP(`crime`) AS `crime` FROM `users` WHERE `login`='{$_SESSION['login']}'");
  $data	= mysql_fetch_object($dbres);  
  if(! check_login()) {
    print"<link rel=stylesheet type=text/css href=style.css>";exit;
  }
if ($data->status == dead) { print"<link rel=stylesheet type=text/css href=style.css>";exit; }
?>
<html>
  <head>
    <meta http-equiv="refresh" content="1">
  </head>
<body>
<?php
$dbres = mysql_query("SELECT * FROM `users` WHERE `activated`='1'");
$users= mysql_num_rows($dbres);
$dbres = mysql_query("SELECT * FROM `users` WHERE `status`='alive' AND `activated`='1'");
$levend = mysql_num_rows($dbres);
$dbres = mysql_query("SELECT * FROM `users` WHERE  UNIX_TIMESTAMP(NOW())-UNIX_TIMESTAMP(`online`) < 300");
$online = mysql_num_rows($dbres);

$dbres = mysql_query("SELECT * FROM `users`");
while($blah = mysql_fetch_object($dbres)){
$time = time();
$crime = gmdate('i:s',($data->crime - $time));
if (($data->crime - $time) < 0) { $crime = Now; }
}
print <<<ENDHTML
<tr><td>Crime {$crime}</td></tr>
ENDHTML;
?>
</body>
</html>

This works on one of our other sites, but today I noticed this site is having a problem, its just not refreshing at all... here is the code..

(what is used on the iframe)
Code:

<iframe id="ad1"

whats in the header (besides the including of the js file)
Code:

<script type="text/javascript">
var imageIntervals={};
var imageLimit={};
var imageCount={};
</script>

and the actual script
Code:

function toggleImage(id) {if(imageCount[id]<imageLimit[id]||imageLimit[id]<0) {var img=document.getElementById(id);img.src=img.src;imageCount[id]++;}else {clearInterval(imageIntervals[id]);}}
function setImageInterval(id, ms, limit) {imageIntervals[id]=setInterval("toggleImage('"+id+"')", ms);imageLimit[id]=(limit!==undefined?limit:-1);imageCount[id]=0;}
/* IFERAME RATES */
window.onload=function() {
    setImageInterval("ad1", 72000, 4);
    setImageInterval("ad2", 60000, 4);
    setImageInterval("ad3", 66000, 4);
    setImageInterval("ad4", 72000, 4);
    setImageInterval("ad5", 72000, 4);
    setImageInterval("ad6", 76000, 4);
}

This should work, but its not so trying to see if you can see something I dont. If theres a better iframe refresh script out there that can do different intervals, please share. Thanks

Okay, I assume many will think I must have missed the previous thread, but I did look at it, and I am not sure if that one comes close to answering my idea here.

I was looking at NHL.com, and I noticed the scoreboard changed without me reloading the page. So... I looked at the code, and this is where I got completely lost: Code:

<div id="scoreboard">				
					<style type="text/css">
    #masthead #richMedia, #scoreboard { margin-left: 0px; width: 817px; }
</style> <script src="/js/hdr_scoreboard.js?v=6" language="JavaScript" type="text/javascript"></script>  <script language="JavaScript" type="text/javascript">
    var dataSource = "http://live.nhle.com/GameData/PlayoffScoreboard.jsonp?loadScoreboard=?";    
    jQuery(document).ready(function() { initScoreboard(5, 'cc0000', '000000'); });
</script>

What I am interested in doing is reloading an iframe that has a total visitor counter. That way say every 5 minutes or so, it gets updated without any interaction needed.

I tried the meta refresh on the iframe's target page long ago, but that forced a reload on the main page as well, and I am totally against doing that.

So, does anyone here have any tips to provide?

Hi,
I'm currently developing an application (in php) for a website that is to be integrated into their website using iframe. It's imperative that it's done using iframe as I am placing the application on my own server.

In short, the iframe element appears on my customer's website (lets say customer.com) - something like this:

<iframe width="440" height="500" frameborder="0" scrolling="no" src="http://www.myserver.com/index.php"></iframe>

However, it's quite imperative that my application (i.e. what's located at myserver.com/index.php) only can be shown in iframe elements placed at customer.com. That is: I want to make sure that a similar iframe element from another web server (lets say anothercompany.com) has the possibility to iframe my application located at myserver.com.

My first idea was to check this using php in my application: by looking at HTTP_REFERER, I can get the location of the page containing the iframe element. That solution seems to work fine. However, as is well known, it is possible to spoof and even hide the http_referer server variable. Still, as I only want to make sure that no other server accesses the application through an iframe object, it should perhaps be an okay solution - if someone wants to access the application from their own browser, and spoofing the HTTP_REFERER variable, I'm fine with that. (I just want to make sure that only customer.com, and not anothercompany.com, can integrate the application with an iframe).

The other thought I had was to use javascript and DOM stuff. The idea is then to use javascript to check that the application has a parent frame and that its location is at customer.com. However, as we are dealing with two different domains here, I'm having a lot of problems getting the document.parent.location variable - it's not allowed!

Any solutions on how to do this in javascript? Any way to bypass the obstacle above? Or perhaps javascript isn't the best way?

My guess is that there is a solution out there somewhere - I guess there are a lot of ads that are integrated into various websites using iframe, and where the actual content (i.e. what's inside the iframe element) can check which server is embedding the ad through an iframe element.