Accessing dynamically generated fields from a child popup

[adamredwards]

I have a page with some form elements that are dynamically generated.
They are inserted into the dom by first cloning a node, changing the
values like name, and then inserted with insertBefore().

When a field gets added, a link that opens a popup window is next to
it. The popup is opened and has the name of the parent element it
should change in it. The user can use the popup to get a list of
results. In the results I would like them to be able to click on the
result and it set the value of of the element to the value of the
result.

If I have one of the fields on the page as plain html and not dynamic,
everything works. When I try to access one of the dynamic fields from
the child, it's null. I can access the dynamic field from the parent
no problem, but not from the child.

This function is in the head of the parent window and is called from
the child:
function setValue(elementId, val)
{
var el = document.getElementById(elementId);
el.value = val;
}

The child calls this function like this:
window.opener.setValue('myElementId', 'value');

I've also tried setting the value like this from the child:
window.opener.document.forms[formName].elements[elementName].value =
val;

And this:
var el = window.opener.document.getElementById(elementName) ;
el.value = val;

Again, whenever I run the code on an element that was not dynamically
inserted into the dom, it works fine. It only has trouble on elements
that were put in dynamically.

If anybody has any suggestions, they would be greatly appreciated.

Adam

[adam]

Well I found out what was wrong so I decided to post the answer for
anyone else. If all else fails make sure you aren't confusing the
browser into thinking you are trying to access something under another
domain. Basically, my development server is my workstation, and I
access the site using a domain that is in my hosts file that points to
localhost. Apparently, this caused a problem, making the browser think
that the parent and child windows were not on the same domain. I
copied the code to the production machine, which has a real domain, and
everything worked fine. Hopefully this will keep someone else from
pulling their hair out for days over something like this.

If you are having trouble accessing objects when dealing with parent
child relationships, first make sure the browser doesn't think you are
trying to access across different domains.

Adam
ad**********@gmail.com wrote:

I have a page with some form elements that are dynamically generated.
They are inserted into the dom by first cloning a node, changing the
values like name, and then inserted with insertBefore().

When a field gets added, a link that opens a popup window is next to
it. The popup is opened and has the name of the parent element it
should change in it. The user can use the popup to get a list of
results. In the results I would like them to be able to click on the
result and it set the value of of the element to the value of the
result.

If I have one of the fields on the page as plain html and not dynamic,
everything works. When I try to access one of the dynamic fields from
the child, it's null. I can access the dynamic field from the parent
no problem, but not from the child.

This function is in the head of the parent window and is called from
the child:
function setValue(elementId, val)
{
var el = document.getElementById(elementId);
el.value = val;
}

The child calls this function like this:
window.opener.setValue('myElementId', 'value');

I've also tried setting the value like this from the child:
window.opener.document.forms[formName].elements[elementName].value =
val;

And this:
var el = window.opener.document.getElementById(elementName) ;
el.value = val;

Again, whenever I run the code on an element that was not dynamically
inserted into the dom, it works fine. It only has trouble on elements
that were put in dynamically.

If anybody has any suggestions, they would be greatly appreciated.

Adam