...

View Full Version : getElementById() returns null for dynamic objects?



lore
06-14-2007, 12:28 PM
Hi,
I have a problem in a function which adds entries to a form looping on the number of objects found.

At each iteration the function appends a dynamically created "li" object to a dynamically created "ul" object. The problem is that at each iteration I also want to append the current "ul" object to the PREVIOUSLY created "li" object. So I save its ID in "myliIdOld" at the iteration "i-1" and re-pass it to the function at the iteration "i" so that I could use "getElementById(myliIdOld).appendChild(myul);"

Unfortunately getElementById(myliIdOld) returns null even if "myliIdOld" is well defined.

Is this because I am dealing with dynamic objects? it seems that getElementById() does not work for objects created with createElement(). How can I get around this problem?

Here is a part of the code



function createTreeLeaf(isNotTopTree,isFirst,isLast,isDir,name,myliIdOld, myul_top)
{
....
var myul = parent.frames['status'].document.createElement('ul');
myul.setAttribute('id','ul_'+name)
document.getElementById(myliIdOld).appendChild(myul); <- This does not work

var myli = parent.frames['status'].document.createElement("li");
myli.setAttribute('id','li-'+name);
myul.appendChild(myli)
var myliIdOut = myli.id;
....
}

}


Thanks in advance,
Lorenzo

_Aerospace_Eng_
06-14-2007, 01:04 PM
Have you tried parent.document.getElementById?

lore
06-14-2007, 02:24 PM
Hi,
yes but it still does not work. In fact I do:



var myul = parent.frames['status'].document.createElement('ul');
myul.setAttribute('id','ul_'+name)
alert(parent.frames['status'].document.getElementById(myliIdOld));
parent.frames['status'].document.getElementById(myliIdOld).appendChild(myul);


The only difference with what you suggest is in "frames['status']" in between parent and document.

Any other suggestion?
Thanks again!
Lorenzo

Mr J
06-14-2007, 03:00 PM
This should work

parent.frames['status'].document.getElementById(myliIdOld).appendChild(myul);

lore
06-14-2007, 03:07 PM
Hi,
thanks but that's where i started but it did not work so I went to see what getElementById returns and that's "null". How can appendChild(myul) work on null? Would you mind to clarify this?

lore
06-14-2007, 05:31 PM
Maybe I will try to be more specific:

Hi,
I posted a short version of the problem before but since I cannot solve it I will give a bot more details. I have this code (below) that creates a tree iterating on some objects and adds a branch to tree at each iteration. The problem is (still) that at the n+1 iteration I need an object created dynamically at the "n" iteration but getElementById(oldObject) returns always null even if its id is defined and even if I appended it to the document structure.




function myRequest(sourceObj)
{

if (http_request.readyState == 4)
{
if (http_request.status == 200)
{

var xmldoc;
var directory_l;

// Load the xml elements on javascript lists:

if (http_request != false)
{
xmldoc = http_request.responseXML;
directory_l = xmldoc.getElementsByTagName('directory');
}

if(directory_l.length) {

// get hold of paragraph in HTML document

var mypar = parent.frames['status'].document.getElementById('formsParId');

// create my form

var myform = document.createElement("form");
myform.setAttribute('name',sourceObj.name);
myform.setAttribute('id',sourceObj.name);

var myline = document.createElement("br");

// begin form

var myul_top = document.createElement('ul');
myul_top.setAttribute('id','tree-checkmenu');
myul_top.setAttribute('class','checktree');

myform.appendChild(myul_top);

// append form to paragraph

mypar.appendChild(myform);


// append tree branches



for(var i = 0; i < directory_l.length; i++)
{

var myliNew = document.createElement("li");

createTreeBranch(i,myul_top,myliNew);

}


}
}

}
}

/***********************************************************/

function createTreeBranch(i,ul_top,myli)
{

if(i>0){ //not first iteration for which ul already defined in function updateMeListRequest()
var myul = document.createElement('ul');
myul.setAttribute('id','tree-eplorer');
document.getElementById(myli.id).appendChild(myul);
}


li_name = "li"+i;
myli.setAttribute('id',li_name);
if(i==0) myul_top.appendChild(myli); //append to top ul
if(i>0) myul.appendChild(myli);

check_name = "check"+i;
var chbox = document.createElement('input');
chbox.setAttribute('id',check_name);
chbox.setAttribute('type','checkbox');
myli.appendChild(chbox);

label_name = "label"+i;
var label = document.createElement('label');
var labeltext = document.createTextNode(label_name);
label.appendChild(labeltext);
myli.appendChild(label);

};



The red part is where the problems are. In the createTreeBranch() function document.getElementById(myli.id) returns always null even if I appended "myli" in the previous iteration. The script stops at that line. Please any idea is very welcome, I really need this to work...Thanks in advance!

glenngv
06-14-2007, 05:56 PM
Try appending the li's first to the ul (and the innermost ul to each li) before appending the outermost ul to the form.

And why do you have to do document.getElementById(myli.id) when you already have the li object myli? This should be enough.

myli.appendChild(myul);

lore
06-14-2007, 06:30 PM
Sigh, before I was passing only the object id and having the mentioned problem. The whole businnes of passing the object was to do what you suggested but I forgot to do it then :(

That seems to solve the problem, while appending the li's first to the ul before appending the outermost ul to the form does not seem to change anything.

I still don't understand why I can't use the id to get the element but it works!
Thank you so much.

glenngv
06-14-2007, 07:04 PM
I still don't understand why I can't use the id to get the element but it works!
Thank you so much.
You didn't set the id of myliNew.

var myliNew = document.createElement("li");
createTreeBranch(i,myul_top,myliNew);
...
function createTreeBranch(i,ul_top,myli)
{
if(i>0){ //not first iteration for which ul already defined in function updateMeListRequest()
var myul = document.createElement('ul');
myul.setAttribute('id','tree-eplorer');
document.getElementById(myli.id).appendChild(myul);
}
...
}



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum