I want open window but when user refreshed parent location or going to hyperlink, we got last child window and using this code win_pop.location.replace('http://example.com') .
for example :
var win_pop = window.open(url, 'lastWin', 'width=300px,height=200px,top=1200px,left=2000px');
why after refresh parent location child window doesn't working.! before any refresh or going to hyperlink in parent page that working well.
win_pop.location.replace('http://example.com') !!
Do you got any best suggest ?
You load a page
You assign a value to a variable called win_pop
You load a new page
The lifespan of a JavaScript program running in an instance of a webpage is only as long as that webpage instance exists.
When you have a new page, you have a new JS environment, and the old data is lost.
win_pop no longer contains the value you assigned to it.
Much of the time you can store data between pages (e.g. via Local Storage), but that only applies to simple objects, arrays and primitives.
There is no way to preserve the reference to a new window.
The only way to achieve that effect would be to avoid reloading the original page. For example, by performing all navigation to "new pages" by using Ajax and manipulating the history with pushState and friends.
#Quentin is right about what happens to your js variable, but he seems to have forgotten a little thing:
You can make use of the postMessage API and the MessageEvent.source property which will point to your popup Window.
So you can start a loop on your popup which will post a message every n-th seconds to window.opener.
setInterval(function(){
window.opener.postMessage('foo', '*');
}, delay);
Then in all your pages, you will listen for the message event, and set your popup variable to the MessageEvent.source you just retrieved:
onmessage = function(evt){
popup = evt.source;
};
And voilà!
Here is a plnkr
Related
SUMMARY:
In MSIE 11, in a popup window when I fill a certain field with data it stays filled, or not, depending on if the popup window has window.close() called on it. Can't repeat with other browsers.
DETAILS:
I have a popup web page (a JSP page, if it matters to someone) I use to fill existing fields in a web form. I added a new field and it is filling OK -- sometimes.
Here is the pertinent section of the page, cleaned up for presentation. My actual page doesn't hard-code emails in the Javascript object.
function fillForm() {
var parentWindowOrder = window.opener.salesOrder;
var formData = parentWindowOrder.workingData;
[snip]
var xferEmails = {"emails":["jerome#myserver.com","jerome2#otherserver.com"]};
formData.user_emails = xferEmails.emails;
[snip]
}
window.close(); // HERE IS THE TOGGLE OF MY PROBLEM
In MSIE, if window.close() is disabled (commented out) then everything works OK. Elsewhere in the page the formData.user_emails can be referenced OK. Of course, the popup page still exists and must be manually closed. When using the console the query yields:
>formData.user_emails
["jerome#myserver.com","jerome2#otherserver.com"]
In MSIE, if window.close() is executed in the popup then the popup closes, of course. However, the values stored aren't preserved. When in the popup window itself, either before or after calling window.close(), the field is set and stays set. But after that the values are gone:
>formData.user_emails
{}
In other browsers I get the success condition.
Normally you'd say "You're changing the value elsewhere in your code"; however, I've already swept through my code looking for other references. Here, shown above, is the only place it gets set in my scenario.
In my practice other fills of variables through JSON-like syntax (xferEmails) works OK, even in MSIE. Not this particular one. What with window.close() could influence this?
Thanks for replies,
Jerome.
formData is initialized in the popup opened and within the scope of fillForm function. This is assigned to salesOrder variable of parent window. Did you re-initialize formData with salesOrder in parent window? If you didn't then it should be accessible via salesOrder.
I have a calendar and when I click on a <td>, a pop-up window appears so you can create your evenement for the date you selected. I want to add a feature.
When the user finishes creating the event, I want to send a JavaScript request to the parent page so I can refresh the calendar using AJAX. Basically, I want to call a function from the child, but the function is on the parent page.
On Google, I only found a script that can refresh the parent window – nothing about a “parent callback”. ☹ Is it even possible?
P.S. The answer can be pure JS or jQuery, it doesn’t matter. I’ll keep looking in the meanwhile.
What you're looking for is a reference to the window that opened the popup window. Once you have that, you can call functions in that window, read and write variables in that window, or even manipulate its DOM.
That reference is called opener. It gives you the window object for the window that opened the current window. For example, if you have a function in the original window like this:
function updateMe( data ) {
alert( data );
}
then in the popup window you could call it like this:
opener.updateMe( 'Hello!' );
Naturally, you need to make sure that updateMe() is a global function in the original page. Or if you have some object in the original page and updateMe() is a method of that object, you can still do it, as long as the object is global. e.g. in the host page:
var myObject = {
updateMe: function( data ) {
alert( data );
}
};
then in the popup you could do:
opener.myObject.updateMe( 'Hello!' );
Basically, as long as you could get to the object or function in the original page with window.whatever, then in the popup you can simply change that to opener.whatever.
If I open a window using
window.open('myurl.html', 'windowname', 'width=100,height=100');
How do I refer to the new window (from the same page that opened it) using 'windowname'? This question is specifically about this. I'm aware that I could save a reference to the handle by using "var mywin = window.open(...)" but I don't care about that in this situation.
Thanks, - Dave
In firefox (might work in other browsers too, but now it's not my concern) I was able to reference one window accross multiple page loads with
var w = window.open("", "nameofwindow");
This opens new window if it doesn't exist and return reference to existing window if it does exist without changing contents of the window.
With jQuery I was then able to append new content, to make quick collection of interresting links like this
$('body', w.document).append(link_tag);
If you didn't save a reference to the window then there is no way to restore it. However, if that window is still open and if the page loaded there belongs to the same domain as your page, you can run JavaScript code in it:
window.open("javascript:doSomething()", "windowname");
Whether that's sufficient in your scenario depends on what you are trying to achieve.
Petr is correct:
var w = window.open("", "nameofwindow");
works in all browsers, I am using it to retrieve the reference to the window object previously opened by a different page. The only problem is the initial opening of the page, if the popup does not exist, you will get a new window with a blank page.
I tried invoking a Javascript function inside the context of the other document in order to check whether I opened a new window or retrieved the already active page. If the check fails, I just invoke window.open again to actually load my popup content:
var w = window.open("http://mydomain.com/myPopup", "nameofwindow");
Hope that helps.
It is not possible. The windowName is just to be used in target="..." of links/forms or to use the same name again in another window.open call to open a new url in that window.
Try open that window with the name, but URL is '' again, to check if it's a blank window or not. If it's in open, then you will get the window; if not, a new window open, and you need close it.
Add the children in localStorage will help to prevent to open the new blank window.
Please check my code in https://github.com/goldentom66/ParentChildWindow
Sorry I am posting late, but if you still have the other window open, and they are on the same domain, you can run, on the first window:
function getReference(w) {
console.log('Hello from', w);
}
And on the second window:
window.opener.getReference(window);
afaik there's no way like windows['windowname'].
The 'windowname' assigned in window.open() can be addressed as a target in <a target="windowname" [...] >
Can Anyone tell me the difference between window.location.href and top.location.href ?
And also where to use which one.
And which one will be better when redirecting after an ajax call in mvc?
window.location.href returns the location of the current page.
top.location.href (which is an alias of window.top.location.href) returns the location of the topmost window in the window hierarchy. If a window has no parent, top is a reference to itself (in other words, window === window.top).
top is useful both when you're dealing with frames and when dealing with windows which have been opened by other pages. For example, if you have a page called test.html with the following script:
var newWin=window.open('about:blank','test','width=100,height=100');
newWin.document.write('<script>alert(top.location.href);</script>');
The resulting alert will have the full path to test.html – not about:blank, which is what window.location.href would return.
To answer your question about redirecting, go with window.location.assign(url);
top object makes more sense inside frames. Inside a frame, window refers to current frame's window while top refers to the outermost window that contains the frame(s). So:
window.location.href = 'somepage.html'; means loading somepage.html inside the frame.
top.location.href = 'somepage.html'; means loading somepage.html in the main browser window.
Two other interesting objects are self and parent.
The first one adds an item to your history in that you can (or should be able to) click "Back" and go back to the current page.
The second replaces the current history item so you can't go back to it.
See window.location:
assign(url): Load the document at the provided URL.
replace(url): Replace the current document with the one at the provided URL. The difference from the assign() method is that after using replace() the current page will not be saved in session history, meaning the user won't be able to use the Back button to navigate to it.
window.location.href = url;
is favoured over:
window.location = url;
top refers to the window object which contains all the current frames ( father of the rest of the windows ). window is the current window.
http://www.howtocreate.co.uk/tutorials/javascript/browserinspecific
so top.location.href can contain the "master" page link containing all the frames, while window.location.href just contains the "current" page link.
We've got the following situation, running from a single domain:
Page A uses window.open() to open a named window (a popup player). window.open() gives page A a reference to the window.
User now reloads page A. The reference to the named window is lost. Using window.open() to "find" the window has the unfortunate side effect of reloading it (undesirable). Is there any other way to get a reference to this window?
Try this:
var playerUrl = 'http://my.player...';
var popupPlayer= window.open('', 'popupPlayer', 'width=150,height=100') ;
if(popupPlayer.location.href == 'about:blank' ){
popupPlayer.location = playerUrl ;
}
popupPlayer.focus();
It will open a blank window with a unique name. Since the url is blank, the content of the window will not be reloaded.
AFAIK, no there isn't..
A kind-of-dirty-but-i-guess-it-will-work hack would be to periodically reset the reference on the parent window from within the popup using window.opener, with something like this code:
setInterval(function() {
if(window.opener) {
window.opener.document.myPopupWindow = window
}
}, 100)
In the parent window, you'll be able to access document.myPopupWindow, even after a reload (well, 100ms after the reload). This should work cross browser.
Actually what you did is destroy the parent (page A) of the created window (Popup), so it has no more reference to the original parent therefore you can't get a direct reference.
The only solution I can think of is using a browser that offers you added javascript capability to cycle through active windows (tabs) and find one that has a special property (ie: your reloaded page A) that gets recognized by the popup.
Unfortunately I guess only firefox has some added capability or extension that gives you this flexibility. (it is also a security risk though)
This should work. Add this code in the popup:
function updateOpener() {
if (window.opener)
window.opener.document.myPopupWindow = window;
else
setTimeout(updateOpener, 100);
}
updateOpener();
And this in onload of the parent window. To make sure myPopupWindow have been set wait 100 ms before accessing it.
setTimeout(function() {
if (document.myPopupWindow)
document.myPopupWindow.focus();
}, 100);
If all the windows share a common Url origin you can register a ServiceWorker and then access all windows from the ServiceWorker: https://developer.mozilla.org/en-US/docs/Web/API/Clients
AFAIK You won't be able to pass a reference to other windows from WorkerService to your window but you can establish communications with the ServiceWorker via
https://developer.mozilla.org/en-US/docs/Web/API/Worker/postMessage
https://developer.mozilla.org/en-US/docs/Web/API/Client/postMessage
It Might help someone, If you opened an child tab and after refreshing the parent tab, you still want to focus on that child tab instead of opening new child tab: -
const chatPopup = window.open('', 'chatPopup');
if (chatPopup.location.href === 'about:blank' || !chatPopup.location.href.includes('/chat')) {
this.openNewWindow = window.open('/chat', 'chatPopup');}