How to reload Main Page from within an iFrame

Question

Within my scenario, I have a button within an iframe section of my page that performs some database processing.

What I need is a means of performing a page refresh of the main page, when this button within the iframe is pressed.

I am seeking some JavaScript code that I can trigger within the iframe, that will reload the main window holding the iframe.

score 128 · Accepted Answer · answered Jun 05 '09 at 06:08

128

window.top.location.reload();

answered Jun 05 '09 at 06:08

Matthew Flaschen

278,309
50
514
539

3

+1 for using window.top to make sure the main page is being targeted. – peirix Jun 05 '09 at 06:20
Thanks the reload answer - what about performing a page refresh using javascript in ie6? – tonyf Jun 05 '09 at 15:30
What happens if the main page is inside a frameset?? – rahul Jun 24 '09 at 06:56
@rahul, this will "reload the main window" (i.e. the very top), which is what tonsils requested. – Matthew Flaschen Feb 06 '12 at 06:16

score 21 · Answer 2 · answered Apr 08 '14 at 09:53

21

If the parent's and child iframe domains will be different you will get cross-window security error, in that case you can try to use following:

window.parent.location = document.referrer;

answered Apr 08 '14 at 09:53

Sid

4,302
3
26
27

2

You are right. When using `window.top.location.reload();` code for reloading parent page within iframe from different origin this gives security error: `Blocked a frame with origin "iframe-url-here" from accessing a cross-origin frame.` But your sample works perfectly! Thank you for your answer! – Farid Imranov Feb 07 '19 at 13:39
`Failed to set the 'href' property on 'Location': The current window does not have permission to navigate the target frame to ''` – cdosborn Sep 27 '19 at 03:58

Jeff Walden · Answer 3 · 2014-08-28T20:44:04.917

10

window.parent.location.reload();

edited Aug 28 '14 at 20:44

answered Jun 05 '09 at 06:08

Jeff Walden

7,008
2
38
55

1

Reloads frame parent rather than "Main Page", only traverses one level without additional .parent specifications, .top as Matthew suggested reloads the "Main Page" regardless of level count – Divvy Jun 15 '18 at 06:07
The original question description doesn't suggest there's any more than one level of frame -- nor that _if_ there is more than one level, it's desired that the topmost level of all those levels be the one reloaded. And if your main page happened to be loaded into a frame in some _other_ site, my approach _would_ reload that main page -- while reloading `window.top` would not. – Jeff Walden Jun 19 '18 at 03:36

score 4 · Answer 4 · answered Aug 12 '14 at 20:58

We can easily achieve the facing goal by set target="_parent" to the Links which inside the iframe.

Just like the following demo shows:

<!--ParentPage.htm-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
</head>
<body>
Parent Page
<iframe src="FramePage.htm"></iframe>
</body>
</html>


<!--FramePage.htm-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<a href="http://www.g.cn" target="_parent">hello</a>
</body>
</html>

score 1 · Answer 5 · answered Feb 06 '17 at 05:42

1

define allFrame variable on your top frame:

var allFrame=1

and on all your frames check this function

if(top.allFrame === undefined)
{
    window.parent.location = "your website top frame";
}

answered Feb 06 '17 at 05:42

Anar Quliyev

11
2

score 0 · Answer 6 · edited Aug 10 '17 at 09:36

0

window.opener.top.location.reload();

edited Aug 10 '17 at 09:36

Unamata Sanatarai

6,475
3
29
51

answered Aug 10 '17 at 08:44

Serdari

41
3

score 0 · Answer 7 · edited Mar 13 '19 at 13:11

0

If you code Page with aspx C# you can view code:

ClientScript.RegisterStartupScript(this.GetType(), "LoadParent", "<script language=javascript>window.parent.location.reload();</script>");

edited Mar 13 '19 at 13:11

Zoe

27,060
21
118
148

answered Mar 13 '19 at 13:03

dac san vinafood

1
1

score 0 · Answer 8 · answered Apr 04 '23 at 19:07

This answer solved my problem. I just needed to click a link that is inside iframe so that after clicking that link the parent page in which the iframe is actually running could change in the browser.

We can easily achieve the facing goal by set target="_parent" to the Links which inside the iframe.

Just like the following demo shows:

<!--ParentPage.htm-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
</head>
<body>
Parent Page
<iframe src="FramePage.htm"></iframe>
</body>
</html>


<!--FramePage.htm-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<a href="http://www.g.cn" target="_parent">hello</a>
</body>
</html>

How to reload Main Page from within an iFrame

8 Answers8

Linked