Question

I have a page generated by Yii CListView which contains a div andmultiple child divs.I need to access a specific the child div and add one more div into that.

Although I managed to solve it using one approach but dont think its the right one. Following is the overview of my solution (the code below does not contain all necessary variables declarations and other stuff, I have pasted the core code not the complete.):

1. Accessed the parent div by Id (Since the Id was available as I can
   code this into Yii)

2. Obtained all the elements in this div using :

   var div_childern = document.getElementById('StudentGridViewId').getElementsByTagName('*');
   

3. Iterated through and when reached to the desired div, added my new div. Please note that the div in which I want to add new div has the class name as “items”. Code as below:

       for (var i = 0; i < div_childern.length; i++) {
       if (div_childern[i].getAttribute('class')=='items'){
           document.getElementById('StudentGridViewId').getElementsByTagName('*')[i].appendChild(newdiv);
           i=div_childern.length+1;
       }
     }
   

The only problem in this solution is, I am accessing the whole document twice, the call to getElementsByTagName. First to obtain the list of all items and then again to add my new div. Is there a better way to this ?

and also, could anyone point me to set the Id of the “items” div that Yii generates?

Thanks
Faisal

Answer 1

You might be able to get a much more elegant solution if you use JQuery.
But, if you want to use the traditional javascript, here is what you could do

  for (var i = 0; i < div_childern.length; i++) {
    if (div_childern[i].getAttribute('class')=='items'){
        div_childern[i].appendChild(newdiv);
        i=div_childern.length+1;
    }
  }