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

ExtJs加载JSON格式树

阅读更多
html文件中加入
<script src="treedata.js"></script>
/**
		 * 动态加载JSON格式的数据
		 */	
		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
		}]
	}]
};

 

分享到:
评论

相关推荐

    EXTJS下JSON对象实用源码 包含页面代码及后台JAVA类代码

    压缩文件中包含了两个文件,第一个文件详细说明了在页面上EXTJS如何使用JSON对象进行数据的查询与加载。第二个文件详细说明了在后台JAVA类中,如何对JSON对象进行处理,并返回JSON对象,以供前台页面使用

    ExtJS构造动态异步加载

    AJAX: 以JSON数据格式,使用ExtJS构造动态异步加载的树。

    ExtJS_Tree利用_JSON_在Struts_2实现Ajax动态加载树结点

    ExtJS_Tree利用_JSON_在Struts_2实现Ajax动态加载树结点,精彩不容错过。

    Extjs Tree + JSON + Struts2 示例源代码

    在我的随笔Extjs Tree + JSON + Struts2中我介绍了如何异步加载一个Extjs的树,但是很多网友留言说不能成功操作。现在我自己做了一个所有源代码的包,供大家下载。 有几点事项请大家注意 1、blogjava的文件上载要求...

    extjs 3.31 TreeGrid实现静态页面加载json到TreeGrid里面

    extjs 3.31 TreeGrid 我的小改动,实现静态页面加载json到TreeGrid里面

    Extjs4.0+MVC模式+存动态加载

    Extjs4.0+MVC模式+存动态加载,动态加载面板,动态加载控制器,动态加载树叶子节点,后台servlet模拟json数据

    form表单加载复杂json数据

    form表单加载复杂json数据

    Extjs 动态树 数据库

    使用JDBC访问sqlserver 获得数据 生成Json串 Extjs 动态加载Tree 这是个完整项目 但是数据源需要自己配置 重在演示整个流程

    ExtJS4中文教程2 开发笔记 chm

    Extjs4 带复选框的树(Checkbox tree) Extjs4 新的布局方式 Extjs4 锁定表头(Locking Grid)功能 Extjs4.0 MVC实例 Extjs4.0动态填充combobox数据 Extjs4中up()和down()的用法 ExtJS4学习笔记(一)---window的创建 ...

    ExtJS 3.4关于TreePanel的一些实例

    2. 使用TreeLoader加载数据生成树 3. 读取本地Json数据生成树 4. 使用Servlet提供数据 5. 树的事件 6. 右键菜单 7. 修改节点的默认图标 8. 给节点增加提示信息 9. 为节点设置超链接 10. 编辑节点名称 11. 树形的拖放...

    精通JS脚本之ExtJS框架.part2.rar

    13.1 XML/JSON数据格式比较 13.2 容器类MixedCollection 13.3 数据存储基本单元Record与dataField 13.3.1 dataField 13.3.2 Record 13.4 数据存储store 13.4.1 数据载入 13.4.2 对数据进行排序 13.4.3 从...

    轻松搞定Extjs_原创

    第七章:格式化 40 一、用户需要优秀体验的内容 40 二、Ext.util.Format类 40 三、再谈XTemplete 44 四、如果连Format都不能满足XTemplete的需要呢? 45 五、小结 45 第八章:Extjs组件结构 46 一、Extjs的组件结构...

    树形表格菜单 动态添加节点/动态删除节点/动态移动节点

    5.完美支持json格式数据,支持xml(需转换) 6.支持ajax加载节点 7.事件驱动 8.可以动态根据列内容排序 9.简化函数参数,利用{} object输入参数,风格类似Extjs 10.树状结构可以选择出现在某一列,不一定要在第一列 11....

    extjs tree 节点 链接 新窗口

    区别在于,远程脚本调用方式加载树节点信息使用的是WebInvokeTreeLoader,需要通过fn属性来指定用于加载数据的远程方法,并在...而传统的树节点加载器是Ext.tree.TreeLoader,需要指定一个url来获得json数据。

    ExtJSWeb应用程序开发指南(第2版)

    6.8 Ext.util.Format提供常用的格式化方法 6.8.1 ellipsis() 6.8.2 capitalize() 6.8.3 date() 6.8.4 htmlEncode() 6.8.5 htmlDecode() 6.8.6 stripTags() 6.8.7 substr() 6.8.8 lowercase...

    extjs4.0 实现了主页面框架 动态菜单 例子 表单 ajax

    extjs4.0 实现了主页面框架(主框架使用Ext.Viewport,banner使用Ext.panel.Panel,通过toolbar来放置按钮),包括左侧动态菜单实现(采用Ext.tree.Panel)动态从数据库加载数据来显示菜单(后台代码也在了通过json...

    精通JS脚本之ExtJS框架.part1.rar

    13.1 XML/JSON数据格式比较 13.2 容器类MixedCollection 13.3 数据存储基本单元Record与dataField 13.3.1 dataField 13.3.2 Record 13.4 数据存储store 13.4.1 数据载入 13.4.2 对数据进行排序 13.4.3 从...

    毕业设计系统extjs展现-可直接运行

    jar包是extjs3.0实例教程 可直接运行 不需配置tomcat加载后台程序 json数据直接在前台调用 结构清晰 展现完美

Global site tag (gtag.js) - Google Analytics