child window onfocusout event not firing on refreshing - javascript

I have one main window and some child windows. My child window is creating by code behind.
var newWindow = window.open(url, windowName, windowFeatures);
Also I need to add
newWindow.document.onfocusout = this.windowOnUnload;
event to the child. My problem is that, when I need a POST action to this page I again recreate this child window with the same code stated above. But the onfocusout event is not firing. But first time it will fire. Also I am creating the child window is always with the same window name. Please help me finding a solution. Thank you

When you recareate the window, did you mean update its contents with an ajax call? or do you literally close it and then again call window. open, and finally wire the onfocusout event?
If the former is the case, then you will need to rewire the event to the new document that has been obtained using the AJAX call, as the whole document is changed and the previous event handlers for the previous document object are no longer relevant.
Update: could you post all the relevant code that you are using? This is how I can best help.
newWindow.document.onfocusout = this.windowOnUnload; doesn't seem to be the correct way to do what you need. I'm surprised it's working with you. Check this question: Is there a way to detect if a browser window is not currently active?

Related

access dynamically added element on parent window

I need to get information from parent window on a new window. For that I use--
$("#mains").html($(window.opener.document).find(".dqe").html());
Or
$("#mains").html($(".dqe", window.opener.document).html());
It works good. But if I have some elements that are dynamically added on the parent window, the new window doesn't get that part.
Can anyone please help??
Your function only loads the data from the parent window when it is called.
To keep the document in sync you would either need to poll for new data on the other window (run your code again at an interval). You could also send a message to the new window when changes occur using postMessage() (https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage).
Off course these are just some options, bottom line is the second window won't know when it should update unless you tell it when to.
Good luck!

Trying to access parent window element from child [duplicate]

I'm playing around with a few ideas for a project, and one of them needs to somehow have communication between 2 different browser pages/windows/tabs. My goal is this:
I have a main page that has a link that opens a new tab/window. In that window, there is the choice to 'navigate' a part of the main page. The issue is, to my knowledge, there are no physical ties between open windows (and no handle on the 'parent' window accessible by the child).
I've been trying to use opener to reference the parent window, but functions and elements are not responding to my calls from the child.
Is there any way for a child/other window to access elements/functions on a parent window?
I'm attempting to avoid using simulated tabs/frames (which would be easy enough to just reference the parent, or window element to accomplish the goal).
Yes, actually that is possible. If you use window.open() in JavaScript, you can use window.opener. and submit whatever requests you would normally make. Like:
window.opener.document.getElementById('id').innerHTML = "hello";
or using jQuery,
$(window.opener.document).find('#tableInParent').html("hello");
Read more here: http://wisercoder.com/javascript-jquery-parent-windows/
JSFIDDLE HERE
I hope this helps!

Javascript: How to refresh the parent window from the child window

The problem is that window.opener does not work in this case. The reason is because it is null. It is null because the child window will go through a few urls before the javascript can run. So without the original child's DOM (ie: access to window.opener), how can I refresh the parent page?
Don't think that would be possible with JavaScript only. The only solution I can think of is using Ajax to poll to an server-side page that indicates if the page has to be refreshed.
You can (kinda):
Hold a ref to the child in the parent.
wait for a while so the child is on the final URL
use the window ref from (1) to call a
function like registerParent(parentWindow) that takes the window
ref.
Store that somewhere and use as window.opener.
This isn't reliable, but it might work well enough. Good luck.
Maybe you should consider different approach, e.g. instead of regular calls you could do ajax in child window. That would preserve reference to parent window. Or maybe you should drop separate window concept altogether and display everything in one window using ext or jquery ui UI elements. Ext example: http://www.danvega.org/examples/extwindow/basicwindow.cfm, jQuery UI example: http://jqueryui.com/demos/dialog/

Event bubbling jQuery .delegate() or .live() after click event

I've tried so many different possibilities to achieve what I feel like should be a simple code execution. I am loading DOM objects from the server via .load(). One of the loaded items is an input text box with a date in it. I want to load the jdpicker (a plugin datepicker) when I click on the input box. Due to the behavior of .live() and .delegate(), even when I use .die() or .undelegate() respectively, I can't get the popup datepicker to behave normally. It either pops up, allows me to click one object in the window and then immediately closes (I cannot navigate through the months, years without the window closing), or the window pops up and every subsequent click re-executes the code producing multiple instances of the datepicker.
I've tried different combinations of .live(), .delegate(), .one() with no luck. I've tested the datepicker in the main window and know that it works fine there. I could post code, but am not sure which of the ten different attempts I've made would be the best example. I can show my latest attempt.
Does anyone have a suitable example for this? Thanks!
Update
I've edited the code to read as follows:
$("#edit-entry").load("/edit/", { id:id }, function(){
$('.jdpicker').one('click', function(){
$(this).jdPicker();
});
});
This is hinging on becoming the complete answer. The datepicker is no longer calling multiple instances, which is good, but I still can't navigate it's controls (month, year selection). If I click the next month, it will load and close. The next time I click it, it re-opens on the next month. So, it does work, but is certainly not desirable. Any suggestions?
You just can't do that with "live" or "delegate". The fact of the matter is that you'll need to apply your plugin initialization explicitly after ".load()" succeeds.
edit — the change you've made is probably not going to work. Here's your code in English:
"Fetch content from the URL '/edit/' and deposit it into the element with id 'edit-entry'. When that content has been received, then bind a one-time event handler to the "click" function of all elements with class 'jdpicker'. In that event handler, set up the 'jdPicker' functionality for the element."
Instead, what you should be doing is just calling the jdPicker setup directly instead of setting it up so that the user has to click on the elements first.
$("#edit-entry").load("/edit/", { id:id }, function(){
$('.jdpicker').each(function(){
$(this).jdPicker();
});
});

how to remove body onload function in java script?

I met one critical problem in java script .....help me to fix this.......
i have written the onload function in one jsp page say login.jsp...
in tat function i used window.open method to open a new window again with the same jsp page login.jsp with disabling the toolbars......
now wat happening is when iam opening same page again in new window obviously tat body onload function will again get called and opens a new window in indefinite........
but what i want is, i have to remove that onload function in tat jsp page once a new window is opened..
Is it possible to remove tat onload function while getting opened in the new window??
could anyone please come up with an idea or little bit of code to do this using java script??
Since it's the same page a quick workaround could be to check if the current window has been opened programmatically, before executing window.open, something like this:
window.onload = function () {
if (!window.opener) {
window.open(/*...*/);
}
};
The above code checks if the window.opener property has a value.
This property contains a reference to the window that opened this current window, and of course if the current window hasn't been opened programmatically, it will contain null.
In conclusion, the window.open method will be invoked only once.
It seems you're going about this the wrong way.
Although there may be a way to intercept the onload function before it actually runs (some javascript libraries can help you to add a handler to the OnDocumentReady event), but maybe you should be doing something serverside. For example - If you want NOT to popup the window in the second window, then one way is to set a querystring parameter telling the server not to add that attribute to the body tag.
You could also check the referrer. If the user is coming from that page, then don't add the attribute to the body tag.
Try having the popup JSP look to see whether you're coming from the problematic page. If so, set window.onload = null -- better yet, don't set anything at all in that JSP.

Categories