Question

I tried implementing the children function in ExtJS using select(“~ *”), it just didnt work well.

I just want ExtJS to return me a set of immediate child node and ignore all the nodes under child nodes.

<div>
    <span>
        <img/>
        <img/>
    </span>
    <span>
        <img/>
        <img/>
    </span>
    <span>
        <img/>
        <img/>
    </span>
</div>

In fact I just want the number of immediate childs. If I get the select right, I can do a getCount() on the CompositeElement.

Any help will be very much appreciated.

Cheers,
Mickey

Answer 1

If you can id the parent, then you could do something like this to get the children:

<div id='mydiv'>
    <span>
        <img/>
        <img/>
    </span>
    <span>
        <img/>
        <img/>
    </span>
    <span>
        <img/>
        <img/>
    </span>
</div>  

Define a function like this:

    function getChildren(parentId) {
      var kids = Ext.get(parentId).select('*');
      kids = kids.filter(function(el) {
            return el.parent().id == parentId
      });
      return kids;
    }      

In your example, getChildren('mydiv').getCount() will return 3.