I would like to know a good way to add an option to a select element on the parent window. A child window gets pop up on click of a button. Then some data is collected on that window from user. On click of OK, I have to add a new option to the select element on the parent window. I do not want to submit the parent window for that. I tried it with following code. It worked well in Firefox 3.0.4, but it is not working with IE 6.0. It is showing error 'No such interface is supported'.
Thanks for your suggestion and example.
I had preivously tried with only id of element in getElementById function. But your example shows you have taken object of the value in select element. I tried to do that and i got null as object.
Your code shows , adding an option to an element on the same HTML page. But, in my case, I have to set the option in parent HTML page. Is it making any difference here?
I've never used "opener" and IE works fine over here...
I don't think so. Maybe your code was written on the opener as well, not on the child window. If you want to create an element on opener, on parent or on pop-up window, and the code does not belong to those documents, you must specify the Global Object for IE.
I misunderstood what opener actually does - it references the opener lol. I didn't catch this because I didn't know he was trying to access his parent document with that line.
I've never used opener before because I modularize my code in such a fashion that no opened document has control over the parent. I always send calls to parent functions in order to validate and have the "last say" so to speak, as you can see by the script I posted above.
this behavior is a bug in internet explorer. You cannot set the innerHTML of a select box.
I faced a similar situation few weeks ago. Some googling revealed that this is a bug in IE. You can read details on my blog
I am aware they call it a bug - it is a bug. But it's a bug that in my opinion is beneficial for programmers learning DOM manipulation.
Using innerHTML to add elements to a page works perfectly fine in most cases. However, I say it is "bad form" because you aren't using DOM methods to add the elements. This can backfire as you write more complicated scripts that need to access those elements via the DOM right away. When you use innerHTML to add elements, the elements aren't always added to the DOM immediately (in some cases, never). This means its possible in some browsers those elements won't inherit the DOM native functions and won't be added to DOM reference arrays.
As an example, if you add an iframe dynamically using innerHTML, the window.frames reference array is not immediately updated (in some cases, it's never refreshed into the DOM). This can cause problems if your code needs to access that iframe in relation to other frames on the page, or if you need to manipulate the new iframe's src or other attributes. As an example, iirc in Opera you can't access iframes' src attribute using document.getElementById - you can only access it using the window.frames array. This means if you add the iframe via innerHTML instead of DOM methods, you can't rely on any subsequent script to change or read its src.