1. #1
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,507
    Vote Rating
    56
    Animal has a spectacular aura about Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default Error in DomQuery

    Error in DomQuery


    I get the following javascript error in the example code at the end of this post.

    Code:
    cs has no properties
    nodup(undefined)ext-all-debug.js (line 748)
    (no name)(li)ext-all-debug.js (line 892)
    select("ul:first", li, undefined)ext-all-debug.js (line 912)
    selectNode("ul:first", li)ext-all-debug.js (line 922)
    child("ul:first", undefined)ext-all-debug.js (line 2126)
    (no name)()from-markup.html (line 26)
    each(function(), undefined)ext-all-debug.js (line 4544)
    constructMenu(Object dom=ul#ext-gen8 id=ext-gen8 visibilityMode=1, undefined)from-markup.html (line 15)
    (no name)()from-markup.html (line 28)
    each(function(), undefined)ext-all-debug.js (line 4544)
    constructMenu(Object dom=ul#menu-main id=menu-main visibilityMode=1, function())from-markup.html (line 15)
    (no name)()from-markup.html (line 37)
    fire()ext-all-debug.js (line 1382)
    fireDocReady()ext-all-debug.js (line 1411)
    [Break on this error] var len = cs.length, c, i, r = cs, cj;
    When using Element.child("tagname:first"). Here's the "menu from markup" example I posted in that other thread, using Element.child("ul:first") (which would be a little more elegant than using .select and checking the length of the array):

    Could I also suggest a new function Element.children()? Element.select("li") produced all descendant <LI> elements. What is needed is direct children. I used Element.select(">li"), but a children() function alongside child() which only selected from the child nodes would be nice.

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>Menu from markup</title>
    <link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
    <script type="text/javascript" src="../../yui-utilities.js"></script>
    <script type="text/javascript" src="../../ext-yui-adapter.js"></script>
    <script type="text/javascript" src="../../ext-all-debug.js"></script>
    <script type="text/javascript">
    function constructMenu(e, clickHandler) {
      e = Ext.get(e);
      var items = [ ];
    
      e.select('>li').each( function() {
        // set current item properties
        var link = this.child('a:first', true);
        var currentItem = {
          text: link.innerHTML,
          cls: link.className,
          id: link.id,
          handler: clickHandler,
        };
    
        // Check for sub menu.
        var s = this.child('ul:first');
        if (s) {
          currentItem.menu = {items: constructMenu(s, clickHandler)};
        }
        items.push(currentItem);
      });
    
      return items;
    }
    
    Ext.onReady(function() {
    	var m = new Ext.menu.Menu({id: "the-menu", items: constructMenu("menu-main", function(){alert("clicked")})});
    	Ext.get("menu-main").remove();
    	m.render();
    	m.show(Ext.get("container"));
    });
    </script>
    </head>
    <body>
    <h1>Menu from markup</h1>
    <div id="container">
    </div>
    <ul id="menu-main">[*]
        <a class="menu-top">Simple Menu</a>
        <ul>[*]<a>item 1b</a>[*]<a>item 2b</a>[*]<a>item 3b</a>[*]<a>item 4b</a>[/list]  
     [*]
        <a class="menu-top">Nested menu</a>
        <ul>[*]<a id="item1">item 1</a>[*]<a id="item2">item 2</a>[*]<a id="item3">item 3</a>
            <ul>[*]<a>subitem a</a>[*]<a>even another level</a>
                 <ul>[*]<a>foo</a>[*]<a>bar</a>[*]<a>lorem</a>[*]<a>ipsum</a>[/list]          [/list]      [*]<a id="item4">item 4</a>[/list]  [/list]</body>
    </html>

  2. #2
    Sencha User jack.slocum's Avatar
    Join Date
    Mar 2007
    Location
    Tampa, FL
    Posts
    6,955
    Vote Rating
    17
    jack.slocum will become famous soon enough jack.slocum will become famous soon enough

      0  

    Default


    I like the direction this example is headed in.

    Using > or / to get direct children is the default way primarily because you can use that same syntax to go multi levels deep with children. e.g. el.child('/ul.foo/li.bar') or el.child('> ul.foo > li.bar'). Plus do we really want a seperate function just to prepend a > or / ?

    The error you are receiving has been fixed. I ran into it to. The problem was n becomes undefined if there is no first (or nth and others). I will have new rev soon with the fix.

Similar Threads

  1. Getting DomQuery to do my bidding...
    By jeffiel in forum Ext 2.x: Help & Discussion
    Replies: 12
    Last Post: 20 Dec 2007, 12:04 PM
  2. DomQuery expression...
    By jeffiel in forum Ext 1.x: Help & Discussion
    Replies: 6
    Last Post: 17 May 2007, 12:21 AM
  3. httpRequest and DomQuery
    By schnarchnase4u in forum Ext 1.x: Help & Discussion
    Replies: 0
    Last Post: 7 Feb 2007, 3:25 AM
  4. Why selectors (and DomQuery) are indeed cool...
    By jack.slocum in forum Community Discussion
    Replies: 15
    Last Post: 25 Jan 2007, 9:40 AM
  5. DomQUERY help needed
    By JohnT in forum Ext 1.x: Help & Discussion
    Replies: 7
    Last Post: 15 Jan 2007, 7:38 AM

Thread Participants: 1