`
wjt276
  • 浏览: 641230 次
  • 性别: Icon_minigender_1
  • 来自: 合肥
社区版块
存档分类
最新评论

ExtJs加载本地xml格式的数据

阅读更多
 <script type="text/javascript" src="ext/XmlTreeLoader.js"></script>
 <script type="text/javascript" src="xml-tree-loader.js"></script>

 

/**
	 * 动态加载本地xml格式的数据
	 */	
	var mytree_4=new Ext.tree.TreePanel({
		//el:"container",//应用到的html元素id
		animate:true,//以动画形式伸展,收缩子节点
		//title:"Extjs静态树",
		//collapsible:true,
		rootVisible:true,//是否显示根节点
		autoScroll:true,
		autoHeight:true,
		//height:'100%',
		width:'100%',
		lines:true,//节点之间连接的横竖线

		//树加载器(TreeLoader)的目的是从URL延迟加载树节点Ext.tree.TreeNode的子节点。返回值必须是以树格式的javascript数组
		 loader: new Ext.app.BookLoader({
		//loader: new Ext.ux.tree.XmlTreeLoader({
			preloadChildren: true,//若为true,则loader在节点第一次访问时加载"children"的属性
			clearOnLoad: false,//(可选)默认为true。在读取数据前移除已存在的节点
	          dataUrl:'xml-tree-data.xml'
	     }),               		
		root: new Ext.tree.AsyncTreeNode({text:"根目录"}),
			
	       
		collapseFirst:false,
		//添加事件
		listeners : {
		//当点击时在右边主窗口中加载相应的资源
		click : function(node, e){
		alert(node.isLeaf());
					e.stopEvent();//停止href属性产品的链接操作(自动)
					if(node.isLeaf()){//如果是非叶子节点,则不用加载相应资源
						loadPanel(node);//加载叶子节点对应的资源
					}
				}
		}
	});

 xml-tree-loader.js文件

Ext.app.BookLoader = Ext.extend(Ext.ux.tree.XmlTreeLoader, {
    processAttributes : function(attr){
		//alert(attr.leaf + attr.text);
        if(attr.class1){ // is it an author node?
			//attr.leaf = false;
			attr.text = attr.class1;
            // Set the node text that will show in the tree since our raw data does not include a text attribute:
           // attr.text = attr.first + ' ' + attr.last;

            // Author icon, using the gender flag to choose a specific icon:
            //attr.iconCls = 'author-' + attr.gender;

            // Override these values for our folder nodes because we are loading all data at once.  If we were
            // loading each node asynchronously (the default) we would not want to do this:
           attr.loaded = true;
            attr.expanded = true;
			
        } else if(attr.title){ // is it a book node?

            // Set the node text that will show in the tree since our raw data does not include a text attribute:
            attr.text = attr.title ;

            // Book icon:
           // attr.iconCls = 'book';

            // Tell the tree this is a leaf node.  This could also be passed as an attribute in the original XML,
            // but this example demonstrates that you can control this even when you cannot dictate the format of
            // the incoming source XML:
            attr.leaf = true;
        }
    }
});

 

分享到:
评论
2 楼 flyinghui2009 2011-03-08  
我这么写的怎么报错呢?
1 楼 cfwdl 2010-03-11  
js代码中的34行loadPanel(node);
最好发一下

相关推荐

Global site tag (gtag.js) - Google Analytics