一个基于xml 得Ext treepanel

Posted on 2008-12-30 11:23 Robert Su 阅读(932) 评论(0)  编辑  收藏 所属分类: ExtJS
/**
    Create an Ext.tree.TreePanel in the passed Element using
    an XML document from the passed URL, calling the passed
    callback on completion.
    @param el {String/Element/HtmlElement} The tree's container.
    @param url {String} The URL from which to read the XML
    @param callback {function:tree.render} The function to call on completion,
        defaults to rendering the tree.
*/
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);
    
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
    });

//    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;
}

回头有空添加详细注解~~原文中6楼有更详细的解答  http://extjs.com/forum/showthread.php?t=3987





只有注册用户登录后才能发表评论。


网站导航:
 

posts - 103, comments - 104, trackbacks - 0, articles - 5

Copyright © Robert Su