Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 9 of 9
  1. #1
    New Coder
    Join Date
    Apr 2007
    Posts
    16
    Thanks
    0
    Thanked 0 Times in 0 Posts

    getElementById() returns null for dynamic objects?

    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

    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

  • #2
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    Have you tried parent.document.getElementById?
    ||||If you are getting paid to do a job, don't ask for help on it!||||

  • #3
    New Coder
    Join Date
    Apr 2007
    Posts
    16
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Hi,
    yes but it still does not work. In fact I do:

    Code:
           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

  • #4
    Senior Coder
    Join Date
    Aug 2002
    Location
    UK
    Posts
    2,789
    Thanks
    2
    Thanked 14 Times in 14 Posts
    This should work

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

    The most dangerous thing in the world is an idea.
    The most dangerous person in the world is the one with an idea.

  • #5
    New Coder
    Join Date
    Apr 2007
    Posts
    16
    Thanks
    0
    Thanked 0 Times in 0 Posts
    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?

  • #6
    New Coder
    Join Date
    Apr 2007
    Posts
    16
    Thanks
    0
    Thanked 0 Times in 0 Posts
    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.


    Code:
    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!

  • #7
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,042
    Thanks
    0
    Thanked 250 Times in 246 Posts
    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.
    Code:
    myli.appendChild(myul);

  • #8
    New Coder
    Join Date
    Apr 2007
    Posts
    16
    Thanks
    0
    Thanked 0 Times in 0 Posts
    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.

  • #9
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,042
    Thanks
    0
    Thanked 250 Times in 246 Posts
    Quote Originally Posted by lore View Post
    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.
    Code:
    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);    
      } 
      ...
    }


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •