Results 1 to 9 of 9

Thread: Newbie question about iteration

  1. #1

    Default Newbie question about iteration

    This is a complete newbie question. I'm having some issues with iterating through dom elements.

    HTML Code:
    Ext.each(elements, function (element, index) {
                  var subelement = element.query('.foobar');
             });
    I get the following error - element.query is not a function.

    Am I correct in saying that it is the function is passed not the object?

  2. #2
    Sencha User VinylFox's Avatar
    Join Date
    Mar 2007
    Location
    Baltimore, MD
    Posts
    1,501

    Default

    Where is the 'elements' array coming from?

    I'm guessing that 'element' is not actually an Ext.Element, therefore does not have a query method.

    If 'element' is actually an Ext.Component then you will need to call the getEl() method to get it's associated Ext.Element.

  3. #3

    Default

    Thanks for your response. Let me give you some more background on what I am trying to do.

    Select an array of elements on a page based on a css class. As I iterate through each element of the returned array try find a subset of elements based on a css class and then once iterate through this new array to create a new array of elements based on a css class.

    What i didn't outline above was that I started of using -


    HTML Code:
     Ext.select('.aElements').each(function(el){
             findElements(this.query('.bElements'));
             });
    
    var findElements = function (elements, offset) {
    Ext.each(elements, function (element, index) {
                  //inside here I need to find sub elements (within this element only) that have a class of .dElements
             });         });
    I hope that make some sense !

  4. #4
    Sencha User VinylFox's Avatar
    Join Date
    Mar 2007
    Location
    Baltimore, MD
    Posts
    1,501

    Default

    There are a couple of goofy things going on in that code, but I think you can simplify this to:

    PHP Code:
    var myEls Ext.select('.aElements > .bElements > .cElements'); 
    Or something along those lines. That will return a CompositeElement, so take a look at the documentation on how to work with a CompositeElement.

    Chaining could also be used I think:
    PHP Code:
    var myEls Ext.select('.aElements').query('.bElements').query('.dElements'); 
    Now the goofyness...This first section, where you select '.aElements':
    PHP Code:
    Ext.select('.aElements').each(function(el){
             
    findElements(this.query('.bElements'));
    }); 
    Why 'this.query' ? What is 'this' scoped to at that point? I think you meant 'el.query'.

    Also note that 'select' returns a CompositeElement, whereas 'query' returns an Array.

  5. #5

    Default

    I tried chaining earlier - but the getCount() always returns 3 - which corresponds to the number of .aElements on the page regardless of the number of sub elements that are present.

    var myEls = Ext.select('.aElements').query('.bElements').query('.dElements');
    myEls.getCount();

    I can't find any examples of this anywhere for EXTJS.

  6. #6
    Sencha User VinylFox's Avatar
    Join Date
    Mar 2007
    Location
    Baltimore, MD
    Posts
    1,501

    Default

    How about the first example I provided?

    PHP Code:
    var myEls Ext.select('.aElements > .bElements > .cElements'); 
    and what about your usage of 'this' ?

  7. #7

    Default

    Thanks again for your responses.

    PHP Code:
    var myEls Ext.select('.aElements > .bElements > .cElements'); 
    The above code returns a single array of all elements matching the above criteria. What I need is multiple arrays detailing the amount of cElements in each bElements.

  8. #8

    Default

    OK - I think i have figured it out -
    PHP Code:
    var myEls Ext.select('.aElements').each(function(el){
            var 
    myEls2 el.select('.bElements').each(function(el){
                var 
    myEls3 el.select('.cElements')
                
    alert(myEls3.getCount());
             });
         }); 
    Obviously I'm only using the count to see what is being found. This method seems to return the multiple arrays that I need but I am not sure how efficient it is?

    Merci bien

  9. #9
    Sencha User VinylFox's Avatar
    Join Date
    Mar 2007
    Location
    Baltimore, MD
    Posts
    1,501

    Default

    Would be more efficient if you added a tag type before the class name, ie:

    PHP Code:
    Ext.select('div.aElements')
    el.select('div.bElements'

Similar Threads

  1. newbie question
    By nickweavers in forum Ext 3.x: Help & Discussion
    Replies: 8
    Last Post: 13 Oct 2009, 1:55 PM
  2. Lists and Iteration
    By innovator in forum Ext 2.x: Help & Discussion
    Replies: 1
    Last Post: 24 Sep 2008, 5:34 AM
  3. Ext breaks Array iteration?
    By _Sergio_ in forum Ext 1.x: Help & Discussion
    Replies: 4
    Last Post: 21 Oct 2007, 12:43 PM
  4. Newbie question
    By vinolent in forum Ext 1.x: Help & Discussion
    Replies: 5
    Last Post: 14 Aug 2007, 6:30 PM
  5. editor grid iteration?
    By snod0g in forum Ext 2.x: Help & Discussion
    Replies: 1
    Last Post: 27 Mar 2007, 6:43 PM

Posting Permissions

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