Results 1 to 2 of 2

Thread: Adding additional attributes to a tree

  1. #1
    Ext User
    Join Date
    May 2007
    Posts
    69

    Default Adding additional attributes to a tree

    I have implemented the code to build a tree using XML.
    I would like to add an attribute to each node based on a specific xml. For example

    If the xml looked like this:

    <Users>
    <Admins>
    <Name>Bob Schwartz</Name>
    <Userid>1</Userid>
    <Name>John Smith</Name>
    <Userid>2</Userid>
    </Admins>
    <Normal>
    <Name>Frank Toto</Name>
    <Userid>3</Userid>
    </Normal>
    </Users>

    I would like the tree to NOT use the node userid but instead use it to add as an attribute to the John Smith leaf. So it should look like this:

    - Users
    - Admins
    -John Smith
    - Normal
    -Frank Toto


    My code looks like this:
    ---------------------------------------------------------------------
    var tree1 = new createXmlTree('tree1', 'plants2.xml',function(){
    this.render();
    this.getRootNode().expand();

    });

    function createXmlTree(el, url, callback) {
    var tree = new Ext.tree.TreePanel(el);
    var p = new Ext.data.HttpProxy({url:url});
    p.on("loadexception", function(o, response, e) {
    if (e) throw e;
    });
    p.load(null, {
    read: function(response) {
    var doc = response.responseXML;
    tree.setRootNode(treeNodeFromXml(doc.documentElement || doc));
    }
    }, callback || tree.render, tree);

    tree.on('click', function(node){
    // if(node.attributes.nodeType == 1){
    // alert ("click");
    // alert (node.attributes.length);
    //doSomething(node.attributes.yourValue);
    //}
    alert(node.attributes.text);
    alert(node.attributes.id);
    alert(node.attributes.newid);

    });

    return tree;
    }

    /**
    Create a TreeNode from an XML node
    */
    function treeNodeFromXml(XmlEl) {
    // Text is nodeValue to text node, otherwise it's the tag name
    var t = ((XmlEl.nodeType == 3) ? XmlEl.nodeValue : XmlEl.tagName);

    // No text, no node.
    if (t.replace(/\s/g,'').length == 0) {
    return null;
    }
    var result = new Ext.tree.TreeNode({
    text : t

    });

    // Special case of an element containing no attributes and just one text node
    var leafTextNode = ((XmlEl.attributes.length == 0) && (XmlEl.childNodes.length == 1) && (XmlEl.firstChild.nodeType == 3));
    if (leafTextNode ) {
    return new Ext.tree.TreeNode({
    tagName: XmlEl.tagName,
    text: XmlEl.firstChild.nodeValue
    });
    }
    // set folder name
    var result = new Ext.tree.TreeNode({
    text : t

    });


    // For Elements, process attributes and children
    if (XmlEl.nodeType == 1) {
    Ext.each(XmlEl.attributes, function(a) {
    var c = new Ext.tree.TreeNode({
    text: a.nodeName
    });
    c.appendChild(new Ext.tree.TreeNode({
    text: a.nodeValue

    }));
    result.appendChild(c);
    });
    Ext.each(XmlEl.childNodes, function(el) {
    // Only process Elements and TextNodes
    if ((el.nodeType == 1) || (el.nodeType == 3)) {
    var c = treeNodeFromXml(el);
    if (c) {
    result.appendChild(c);
    }
    }
    });
    }



    return result;
    }
    ------------------------------------------------------------------------------
    So basically, looking for guidance on how to modify the code to:
    1. look for user id elements & ignore them (for showing)
    2. user the userid value to add as an attribute of the name node


    Thank you!

  2. #2
    Sencha User
    Join Date
    Apr 2007
    Location
    Italy/UK
    Posts
    152

    Wink

    1,

    before the leaf node stuff, add:

    PHP Code:

                    
    var ignoreNode = ((XmlEl.tagName == 'Userid')
                            || (
    XmlEl.tagName == 'anyOtherTagNameIWant2Ignore'));

                    if (
    ignoreNode) {
                        return 
    null;
                    } 
    2,

    slightly harder to achieve... i image if the userid appeared before the name (instead of after) in the xml, you could save the node's value in a variable then apply it as the id when the next name node is encountered...

    eg:

    PHP Code:

                    
    if (XmlEl.tagName == 'Name') {

                        var 
    result = new Ext.tree.TreeNode({
                            
    text t,
                            
    newid savedId
                        
    });

                    } else {

                        var 
    result = new Ext.tree.TreeNode({
                            
    text t

                        
    });

                    } 
    it would help if you edited your original post and put the code in [php] tags... :-)


Posting Permissions

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