Jump to content

onchange Event from Child Window


jesh

Recommended Posts

Say you have the following page:

<html><head><script type="text/javascript">function openwindow(){	var wnd = window.open();	wnd.document.open();	wnd.document.write("<html><body><scri" + "pt>");	wnd.document.write("window.opener.document.getElementById('test').value='New Value';");	wnd.document.write("</scri" + "pt></body></html>");	wnd.document.close();	wnd.close();}</script></head><body><input type="text" id="test" onchange="alert('changed!');" /><button onclick="openwindow();">Open Window</button></body></html>

If you type text into the text box and change the focus to something else (e.g. click on the body somewhere), the onchange event for the text box will fire and "changed" will be alerted. However, if you click the button to run the javascript, a new window will be opened which will run some javascript to change the value of the text box to "New Value", the onchange event will not fire and there will be no alert.Is it possible to change the value of the text box from a child window and have the onchange event fire? Can anyone help explain to me why the event isn't firing in the element on the parent window when the change is originating from the child window?

Link to comment
Share on other sites

Hmm, just saw on a Google search that I need to call the onchange function when I programmatically change a value to get the onchange event handlers to fire.

window.opener.document.getElementById("test").onchange();

This, however, doesn't pass the DOM Event to that function. Any other ideas?

Link to comment
Share on other sites

Alright, I'm back again. I gotta learn not to post here until after I've spent an hour or two searching...jeez.Found the solution here: http://forums.asp.net/thread/1406703.aspxYou have to dynamically create the event and fire it:

if(document.createEvent){	var onchangeEvent = document.createEvent("HtmlEvents");	onchangeEvent.initEvent("change", true, false);	document.getElementById("test").dispatchEvent(onchangeEvent);}else if(document.createEventObject){	document.getElementById("test").fireEvent('onchange');}

Seems like a kludge, but it works for me on IE6, Firefox (PC and Mac), and Safari. Anyone seen any better solutions?

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...