I have an iframe. On clicking a particular link inside the iframe, an error validation occurs, server-side and subsequently a redirect occurs from the server side. Now, the redirect causes the page to load inside the iframe. Is there any way to make the redirect occur on the parent page? I know its possible to do it if it was a client side validation. But this is a server side validation and the redirect command occurs from the server. In the redirect, i am also loading an error attribute which appears as an error div. Even this gets loaded inside the iframe. (An iframe inside an iframe with an error div).
-
Do you have control of the server script that sends the redirect? Instead of redirecting using server code, you can print some Javascript to redirect the parent window. – mavrosxristoforos Sep 20 '13 at 05:00
-
The validation has to occur server side and consequently the redirect. That is the issue. I tried to do a null check validation of the error attribute that i am sending along with the redirect in my jsp and I was trying to use the javascript inside this jsp validation to redirect to the parent page but that isn't working either. – Ayyangar Sep 20 '13 at 05:04
-
are you seeing the entire parent page inside the child frame? Is that the issue you got there? – Sep 20 '13 at 05:21
-
yes. along with the error div. the redirect link is nothing but the parent page along with the error div that happens to load inside the iframe, and the redirect is happening server side. – Ayyangar Sep 20 '13 at 05:24
4 Answers
Here is the code that @mavrosxristoforos is alluding to in the comments. Use in place of PHP's header()
or whatever redirect you may be employing.
<script type="text/javascript">
window.parent.location.href= "http://your-redirect-url-here";
</script>

- 13,251
- 5
- 38
- 63
-
Thing is validation and redirect is happening server side. I tried to do a null check validation in my jsp, of the error attribute that i am sending along with the redirect and I was trying to use the above javascript that you have mentioned inside this jsp validation to redirect to the parent page but that isn't working either. – Ayyangar Sep 20 '13 at 05:08
-
Yes, validation can still occur server side. But, wherever you had the code to initiate a redirect. INSTEAD, echo/print/output to the browser window the 3 lines of JavaScript. – Patrick Moore Sep 20 '13 at 05:09
-
This is exactly what I meant. Thanks for posting it as an answer. – mavrosxristoforos Sep 20 '13 at 05:11
-
@SetSailMedia Please pardon my ignorance..but I didn't exactly understand what you meant by echo/print/output to browser window..If I am able to do what you have suggested, then nothing like it. Back end is java and i am using return new ModelAndView("redirect:myurl") – Ayyangar Sep 20 '13 at 06:09
-
I wish I could help further, but I have never used JSP/Java, and so I wouldn't know the correct function. Basically what we're trying to do is, instead of create the redirect using ModelAndView(), just output to the browser those three lines of JavaScript. However in JSP you output text to the browser, that is what we're after here. Once that code is sent to the client, the client's browser will execute it and open the error URL in the iframe's parent (the browser window) – Patrick Moore Sep 20 '13 at 14:16
You can communicate between the main window and the iframe only if they use the same protocol!
The "right" way to do so is to use postMessage. You can find two usage examples here and here. So long for the right way.
The quick and dirty:
In the following example the outer window has a JS function called change() which is called everytime the iframe is reloaded. You can use it to detect a div that is being displayed only when an error occurs - and then redirect. The example below redirects to ycombinator website. You can view it here
<html>
<head>
<script type="text/javascript">
function change(obj){
var iframe = document.getElementById('iFrm');
var innerDoc = iframe.contentDocument || iframe.contentWindow.document;
var obj = innerDoc.getElementById('completed');
if(obj !== undefined && obj !== null){
window.location = "https://news.ycombinator.com/";
}
}
</script>
</head>
<body>
<div class="keuzeDiv">
<iframe id="iFrm" src="https://sandbox.plimus.com/jsp/buynow.jsp?contractId=2138644" onLoad="change();" width="100%" height="100%"></iframe>
</div>
</body>
</html>

- 53,191
- 11
- 86
- 129
If you don't want to change your server's output but are looking for a quick and dirty solution, you may be able to do something like this:
See: iFrame src change event detection?
You could check the location of the page you got redirected to (if that matters) and, when the IFRAME has changed locations for the second time (since the first would be when the IFRAME loads initially) you could redirect your main window to the page of interest.
(I guess we could also ask the question: why an IFRAME instead of using an Ajax request to validate input?)
say A is your parent page and B is the child page inside the frame.
on server validation failure don't redirect to page A but B or an error page C!
this is more of a hack I suppose, if you are able to do a hashchange
- redirect to page B with a /#notvalid added at the last in the url when server validation fails
- listen to the load event of the iframe carrying B in the parent page A and check if the iframe's src has '#notvalid' at the end. if yes, show the error div in the parent page!
-
-
:) he is redirecting to the parent page from inside an iframe and is seeing the entire parent page inside the iframe! that is the issue he got, I asked him. – Sep 20 '13 at 05:39
-
i need to redirect to the parent page..and when the parent page loads the error div has to load outside the iframe. – Ayyangar Sep 20 '13 at 05:53