您的位置:首页 > Web前端 > JavaScript

ExtJs加载JSON格式树

2013-06-28 23:05 519 查看
var mytree_2=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.tree.TreeLoader({

preloadChildren: true,//若为true,则loader在节点第一次访问时加载"children"的属性

clearOnLoad: false//(可选)默认为true。在读取数据前移除已存在的节点

}),

root: new Ext.tree.AsyncTreeNode({

text:'ExtJs',

id:'root',

expanded:true,

children:[Docs.classData]

}),

collapseFirst:false

});

treedata.js内容

var Docs = {};

Docs.classData={

"id":"root",

"iconCls":"icon-docs",

"text":"根节点",

"singleClickExpand":true,

"expanded":true,

"leaf":false,

"children":[{

"id":"id1",

"iconCls":"icon-pkg",

"text":"子节点一",

"qtip":"asdk",//需要使用 Ext.QuickTips.init();//开启提示功能

"singleClickExpand":true,

"expanded":true,

"leaf":true

},{

"id":"child2",

"iconCls":"icon-pkg",

"text":"子节点二",

"singleClickExpand":true,//单击节点是否展开

"expanded":true,

"leaf":false,

"children":[{

"id":"child21",

"iconCls":"icon-pkg",

"text":"子节点三",

"singleClickExpand":true,//单击节点是否展开

"expanded":true,

"leaf":true

}]

}]

};
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: