window.opener.location not working in IE - javascript

I'm trying to redirect from child page to parent page with this javascript:
ScriptManager.RegisterClientScriptBlock(this, this.GetType(), "Close", "ClosePopUp();", true);
<script language="javascript" type="text/javascript">
function ClosePopUp() {
window.opener.location= 'ParentPage.aspx';
self.close();
}
</script>
It works with Firefox & Chrome. But not with IE 9.
The error I'm getting is:
Unable to get value of the property 'location': object is null or undefined
alert(window.opener) returns null in IE 9.

After searching for quite a while I have found the solution for internet explorer.
You need to use
window.opener.location.href='';

window.opener is a non-standard property and is not available in all browsers. It will also evaluate to null if the window wasn’t opened from another window, so it seems pretty unreliable.

I think you can use window.open
window.open(URL,name,specs,replace)
More info here
Update
I think I have got it now. Add an eventhandler in your parent window to your child's unload event.
var win = window.open("ChildPage.aspx");
function popUpUnLoaded() {
window.location = "ParentPage.aspx";
}
if (typeof win.attachEvent != "undefined") {
win.attachEvent("onunload", popUpUnLoaded );
} else if (typeof win.addEventListener != "undefined") {
win.addEventListener("unload", popUpUnLoaded, false);
}
This means that when the function below executes your parent page picks up on it.
function ClosePopUp() {
self.close();
}

Related

Javascript window.open does nothing, produces no error

So I've been asked to have it where a new window is produced every time a user loads a page. So I've created the following code located in the tag...
<SCRIPT TYPE="text/javascript">
function popup(mylink, windowname) {
if (! window.focus) return true;
var href;
if (typeof(mylink) == 'string') {
href = mylink;
} else {
href = mylink.href;
window.open(href, windowname, 'width=400,height=200');
}
return false;
}
</SCRIPT>
and the onLoad function to create the popup on page load
<body onLoad="popup('http://yahoo.com', 'ad')">
However, nothing happens. No tab is created, no new window is created, and when viewing through firebug, no error is produced. Attempted this on chrome, firefox and IE9 with the same results, with none of the browsers complaining they've blocked a popup window. Am I missing something incredibly simple here?
If mylink is a string (and it is, in your example), you never call window.open:
if (typeof(mylink) == 'string') {
// Code takes this path
href = mylink;
} else {
// Not this one
href = mylink.href;
window.open(href, windowname, 'width=400,height=200');
}
Having said that: If you fix that, you will get the warning/error from pop-up blockers. Browsers prevent sites from opening pop-ups except in direct response to a user action, like a click. Sites opening pop-ups on page load is one of the reasons for that.
Side note: typeof is an operator, not a function. No need for parens around the operand.

How do I communicate back and forth with a popped up window

In my web page I use this function to show a small pop up Window
function popup (url)
{
poppedUpWindow= window.open(url, "PopupWindow", "width=400,height=300");
poppedUpWindow.focus();
return false;
}
I need to share objects between thoos 2 windows.
I tried doing something like this but it does now work
poppedUpWindow.document.documentElement.addEventListener("load", foo, false);
Is also possible that I do something like this
function popup (url)
{
poppedUpWindow= window.open(url, "PopupWindow", "width=400,height=300");
var tmp = poppedUpWindow.document;
tmp.write('<html><head><title>popup</title>');
....
tmp.close();
poppedUpWindow.focus();
return false;
}
But this approach will make solving the problem much harder.
So how should I transfer information from the parent window to the popped up window and vice versa?
From the documentation for postMessage:
Send a message like this:
otherWindow.postMessage(message, targetOrigin);
otherWindow can listen for dispatched messages by executing the following JavaScript:
window.addEventListener("message", receiveMessage, false);
function receiveMessage(event)
{
if (event.origin !== "http://example.org:8080")
return;
// ...
}
Keep in mind browser support: http://caniuse.com/#feat=x-doc-messaging
IE 8+, Firefox 3+, Chrome all versions, Opera 9.5+, Safari 4+
Here is how I solved the issue for anyone else facing the same issue.
I am considering the browser to be either chrome or firefox. I did not test other browsers. The event "load" in Chrome sometimes gets fired before the whole javascript files loads.
function popup (url)
{
poppedUpWindow= window.open(url, "PopupWindow", "width=400,height=300");
poppedUpWindow.focus();
if(is_chrome)
{
window.setTimeout("doSomething()",300); //this value could vary! 300ms seemed fine to me!
}
else
{
fenster.addEventListener('load', doSomething, true); // FireFox
}
return false;
}
function doSomething()
{
poppedUpWindow.postMessage("hi","*");
var a = poppedUpWindow.document.getElementById("b");
// do anything you want..
}
In the other html there should be this method
function receiveMessage(event)
{
if (event.origin !== stringUrlOfFirstWebPage)
{
return;
}
event.source.postMessage("hey!",event.origin);//talking back to the first web page
}

contentDocument.document returning undefined [duplicate]

I'm trying to get the document object of an iframe, but none of the examples I've googled seem to help. My code looks like this:
<html>
<head>
<script>
function myFunc(){
alert("I'm getting this far");
var doc=document.getElementById("frame").document;
alert("document is undefined: "+doc);
}
</script>
</head>
<body>
<iframe src="http://www.google.com/ncr" id="frame" width="100%" height="100%" onload="myFync()"></iframe>
</body>
</html>
I have tested that I am able to obtain the iframe object, but .document doesn't work, neither does .contentDocument and I think I've tested some other options too, but all of them return undefined, even examples that are supposed to have worked but they don't work for me. So I already have the iframe object, now all I want is it's document object. I have tested this on Firefox and Chrome to no avail.
Try the following
var doc=document.getElementById("frame").contentDocument;
// Earlier versions of IE or IE8+ where !DOCTYPE is not specified
var doc=document.getElementById("frame").contentWindow.document;
Note: AndyE pointed out that contentWindow is supported by all major browsers so this may be the best way to go.
http://help.dottoro.com/ljctglqj.php
Note2: In this sample you won't be able to access the document via any means. The reason is you can't access the document of an iframe with a different origin because it violates the "Same Origin" security policy
http://javascript.info/tutorial/same-origin-security-policy
This is the code I use:
var ifrm = document.getElementById('myFrame');
ifrm = (ifrm.contentWindow) ? ifrm.contentWindow : (ifrm.contentDocument.document) ? ifrm.contentDocument.document : ifrm.contentDocument;
ifrm.document.open();
ifrm.document.write('Hello World!');
ifrm.document.close();
contentWindow vs. contentDocument
IE (Win) and Mozilla (1.7) will return the window object inside the
iframe with oIFrame.contentWindow.
Safari (1.2.4) doesn't understand that property, but does have
oIframe.contentDocument, which points to the document object inside
the iframe.
To make it even more complicated, Opera 7 uses
oIframe.contentDocument, but it points to the window object of the
iframe. Because Safari has no way to directly access the window object
of an iframe element via standard DOM (or does it?), our fully
modern-cross-browser-compatible code will only be able to access the
document within the iframe.
For even more robustness:
function getIframeWindow(iframe_object) {
var doc;
if (iframe_object.contentWindow) {
return iframe_object.contentWindow;
}
if (iframe_object.window) {
return iframe_object.window;
}
if (!doc && iframe_object.contentDocument) {
doc = iframe_object.contentDocument;
}
if (!doc && iframe_object.document) {
doc = iframe_object.document;
}
if (doc && doc.defaultView) {
return doc.defaultView;
}
if (doc && doc.parentWindow) {
return doc.parentWindow;
}
return undefined;
}
and
...
var el = document.getElementById('targetFrame');
var frame_win = getIframeWindow(el);
if (frame_win) {
frame_win.targetFunction();
...
}
...
In my case, it was due to Same Origin policies. To explain it further, MDN states the following:
If the iframe and the iframe's parent document are Same Origin, returns a Document (that is, the active document in the inline frame's nested browsing context), else returns null.

How to check whetherpop up blocker is turned ON or not in a browser using Code ?

How to check whether pop up blocker is turned ON or not in a browser using java or Java script Code ?
function check ()
{
document.login.action= url+"test.jsp";
document.login.submit();
}
I will call this function on click of submit button
How about:
var myWindow = window.open (url);
if (if (myWindow == null || typeof(myWindow )=='undefined'))
{
// popup blocker is enabled
}
else
{
myWindow.close();
}
If you use window.open() to open the popup, check for the return value.
According to the MDC doc center (a good javascript reference) the return value is null if opening the window didn't succeed for whatever reason.
var windowReference = window.open(url);
See the documentation on window.open here.

Javascript addEventListener onStateChange not working in IE

I have two colorbox popup boxes which show a YouTube video in each. When they're finished playing, I'm trying to have them automatically close the colorbox window. This code below works perfect in Firefox, but in IE I can't get addEventListener to work. I've tried attachEvent with no success. Can anybody offer any suggestions as to how to solve this? It seems simple but I'm exhausted trying to find a solution.
UPDATE 1:
Well, this is my current code. It works perfect in Firefox, but IE only outputs good. IE8 debugger doesn't report any errors either...
function onYouTubePlayerReady(playerId) {
if (playerId && playerId != 'undefined') {
if(playerId && playerId == 'ytvideo1'){
var ytswf = document.getElementById('ytplayer1');
alert('good');
} else if(playerId && playerId == 'ytvideo2'){
var ytswf = document.getElementById('ytplayer2');
} else {
}
setInterval('', 1000);
ytswf.addEventListener('onStateChange', 'onytplayerStateChange');
alert('great');
}
}
function onytplayerStateChange(newState) {
alert('amazing');
if(newState == 0){
$.fn.colorbox.close();
alert('perfect');
}
}
Update 3: Solution
Simply put onComplete in my colorbox and put the swfobject in that and it worked perfectly in IE.
IE doesn't support addEventListener does it?? You need attachEvent right?
if (el.addEventListener){
el.addEventListener('click', modifyText, false);
else if (el.attachEvent){
el.attachEvent('onclick', modifyText);
}
from testing in IE it looks like the reference you are using
ytswf = document.getElementById('ytplayer1');
is assigned before the actual swf object is loaded, so IE thinks you are referring to a simple div element
you need to run this code
function onYouTubePlayerReady(playerId) {
ytswf = document.getElementById("ytplayer1");
ytplayer.addEventListener("onStateChange", "onytplayerStateChange");
}
right after you call
swfobject.embedSWF("http://www.youtube.com/v/SPWU-EiulRY?
hl=en_US&hd=0&rel=0&fs=1&autoplay=1&enablejsapi=1&playerapiid=ytvideo1",
"popupVideoContainer1", "853", "505", "8", null, null, params, atts);
before you close out that $(function()
and place var ytswf;
right after the <script>
instead of further down
New answer
The YouTube player object implements its own addEventListener method which is more like how AS3's syntax. As per the information listed here:
player.addEventListener(event:String,
listener:String):Void
YouTube provides an example on the page I linked which I'll provide here:
function onYouTubePlayerReady(playerId) {
ytplayer = document.getElementById("myytplayer");
ytplayer.addEventListener("onStateChange", "onytplayerStateChange");
}
function onytplayerStateChange(newState) {
alert("Player's new state: " + newState);
}
YouTube also provides an example page that seems to prove out that their example code works in IE. I'll link that example page here.
Now, here's an attempt at re-writing the pertinent parts of your code to work as per the examples provided by Google/YouTube:
function onYouTubePlayerReady(playerId) {
if(playerId && playerId == 'ytvideo1'){
var ytplayer = document.getElementById('ytplayer1');
} else if(playerId && playerId == 'ytvideo2'){
var ytplayer = document.getElementById("ytplayer2");
} else {
return;
}
ytplayer.addEventListener('onStateChange', 'onytplayerStateChange');
}
So, it turns out that the mistake being made here arises from the confusion created by the use of the method name 'addEventListener'. In the W3C JavaScript implementation, the second parameter is a function while in the YouTube implementation, the second parameter is a string. Give this a shot =).

Categories

Resources