- 浏览: 1615698 次
- 性别:
- 来自: 长春
文章分类
- 全部博客 (309)
- ext (19)
- web (13)
- PHP (19)
- 互联网新闻 (3)
- oracle (3)
- Mootools (1)
- FLEX (3)
- 人在职场 (2)
- hibernate (24)
- spring2 (1)
- J2SE (24)
- WEB_UI (14)
- 其它 (11)
- Log4J (1)
- iText (10)
- SQL (11)
- 设计模式 (3)
- lucene (6)
- 开源项目 (2)
- javascript (20)
- 软件&破解补丁 (48)
- Quartz (2)
- 解决方案 (1)
- 工作存档 (2)
- JAVA对文件操作 (2)
- C&C#&VC (1)
- struts2 (3)
- 版本控制 (2)
- 软考基础 (23)
- JBPM (2)
- velocity (4)
- javamail (3)
- HttpClient (9)
- 虚拟化技术 (2)
- 报表 (3)
- ibatis (5)
- Spring (4)
- 信用卡 (0)
- 芒果钱包 (0)
- 养卡 (0)
最新评论
-
a601962168:
...
通过JAVA与串口(RS232)通信实例 -
olive009:
...
Adobe Acrobat 9 Pro & Pro Extended 中文版/英文版 下载及破解补丁 -
overshit:
api更新了,一加filter就Callback filter ...
深入浅出CGlib-打造无入侵的类代理 -
u010778233:
写得很不错,已经用起来了,谢谢
将jdbc结果集转换成对象列表 -
924060929:
我想找就是要这个功能!!!!!!!!
velocity基础教程--2自定义ResourceLoader实现字符模板
树是一个我们日常用的组件,Ext给我们提供了一个非常好用的树控件,下面让我们看看用Ext创建一颗树是多么容易的。
通过文件生成Tree
data.txt
ajax读取
注意:ajax默认使用utf-8编码格式,所以我们的jsp也要使用utf-8编码发送数据。
<script> Ext.onReady(function(){ var tree = new Ext.tree.TreePanel({ el:'tree' }); var root = new Ext.tree.TreeNode({text:'root'}); var node1 = new Ext.tree.TreeNode({text:'catalog'}); var node2 = new Ext.tree.TreeNode({text:'catalog1_leaf'}); var node3 = new Ext.tree.TreeNode({text:'root_leaf'}); node1.appendChild(node2); root.appendChild(node1); root.appendChild(node3); tree.setRootNode(root); tree.render(); root.expand(); //可以有两个参数 }); </script> </head> <body> <div id="tree" style="height:800px;"></div> </body> </html>
通过文件生成Tree
Ext.onReady(function(){ var tree = new Ext.tree.TreePanel({ el: 'tree', loader: new Ext.tree.TreeLoader({dataUrl: 'data.txt'}) }); var root = new Ext.tree.AsyncTreeNode({text:'root'}); tree.setRootNode(root); tree.render(); root.expand(); });
data.txt
[ {text:'01',children:[ {text:'01-01',leaf:true}, {text:'01-02',children:[ {text:'01-02-01',leaf:true}, {text:'01-02-02',leaf:true} ]}, {text:'01-03',leaf:true} ]}, {text:'02',leaf:true} ]
ajax读取
Ext.onReady(function(){ var tree = new Ext.tree.TreePanel({ el: 'tree', loader: new Ext.tree.TreeLoader({dataUrl: 'data.jsp'}) }); var root = new Ext.tree.AsyncTreeNode({ id: '0', text:'root' }); tree.setRootNode(root); tree.render(); root.expand(false, false); });
<%@ page contentType="text/html;charset=utf-8"%> <% request.setCharacterEncoding("UTF-8"); response.setCharacterEncoding("UTF-8"); // 对应的是正在展开的节点id String node = request.getParameter("node"); System.out.println(node); String content = ""; if ("0".equals(node)) { content += "[{id:1,text:'节点阿一'},{id:2,text:'节点阿二'}]"; } else if ("1".equals(node)) { content += "[{id:11,text:'节点阿一一',leaf:false},{id:12,text:'节点阿一二',leaf:true}]"; } else if ("2".equals(node)) { content += "[{id:21,text:'节点阿二一',leaf:true},{id:22,text:'节点阿二二',leaf:true}]"; } else if ("11".equals(node)) { content += "[{id:111,text:'节点阿一一一',leaf:true},{id:112,text:'节点阿一一二',leaf:true}]"; } response.getWriter().print(content); %>
注意:ajax默认使用utf-8编码格式,所以我们的jsp也要使用utf-8编码发送数据。
评论
5 楼
dcw650
2011-08-28
还行吧 !!!
4 楼
JavaLanguageFun
2010-01-01
SQ,一直找不到Ext3.1的例子 /
3 楼
nishijia
2009-08-21
请问下 我用了你的ajax调用 tree 但是
我试过换做string 类型的id 不过它的下层节点就显示不出来了
难道是 extjs 定死的么 只能是数字类型?
js 中 Document.getElementById("sss") 这还是可以的呢
引用
content += "[{id:111,text:'节点阿一一一',leaf:true},{id:112,text:'节点阿一一二',leaf:true}]";
为什么必须都是int型? 为什么不可以是String呢我试过换做string 类型的id 不过它的下层节点就显示不出来了
难道是 extjs 定死的么 只能是数字类型?
js 中 Document.getElementById("sss") 这还是可以的呢
2 楼
yuanqixun
2009-07-27
谢谢搂主的分享
1 楼
yiluxiangbei
2009-02-26
我也是要用到这个tree,现在学习一下,谢谢分享
发表评论
-
ExtJS 2 系列教程
2009-02-08 18:23 3258如果大家对JEE的深入研究有兴趣 可以加入Q群:4617650 ... -
[ExtJS2.1教程-7]Tree(树控件)
2009-02-08 18:10 8061树控件: 树是由根节点、叶子节点、非叶子节点(目录节点)组成的 ... -
[ExtJS2.1教程-6]Tip(提示框)
2009-02-08 09:32 8187信息提示框是指当我们把鼠标移动并停留到页面上的某一个元素上时, ... -
[ExtJS2.1教程-5]ToolBar(工具栏)
2009-02-07 09:25 9701面板中可以有工具栏,工具栏可以位于面板顶部或底部,Ext中工具 ... -
[ExtJS2.1教程-4]Menu(菜单)
2009-02-04 21:20 9883menu.html <html> < ... -
[ExtJs 2.02]Grid默认选择首行并允许键盘操作
2009-01-23 14:39 4193grid默认选中第一行问题解决了 grid.getSelect ... -
[电子书]LearningExtJS(完整版2.01 en)
2009-01-22 11:11 2310What you will learn from this ... -
[ExtJs 2.02]ajax文件上传
2009-01-21 15:32 7181例子是网上找的,不过是php的 给转成jsp 吧中间遇到的问题 ... -
[ExtJs 2.02]Combobox的使用
2009-01-21 10:51 28211.简单使用: <!DOCTYPE HTML PUB ... -
grid设置某列背景颜色
2009-01-16 10:47 1824css .x-grid-back-red { back ... -
grid设置某行字体颜色
2009-01-16 10:34 3536css代码 .x-grid-record-red ... -
Ext2.0.2用于netbeans的JavaScript的库
2009-01-05 14:39 1675Ext2.0.2用于netbeans的JavaScript的库 ... -
Ext2.1API中文文档
2009-01-04 08:58 2517Ext2.1API中文文档 基本上Ext2系列都实用 需要Ad ... -
[ExtJS2.1教程-3]事件机制
2009-01-02 23:26 3408javascript的事件我们用的最多的就是用于表单验证 现在 ... -
[ExtJS2.1教程-2]组件的使用
2009-01-02 19:09 2635我们还是以alert为例 首 ... -
[ExtJS2.1教程-1]HelloWorld
2009-01-02 14:16 2656ExtJS:一个很强大的ui库 创建一个漂亮的alert &q ... -
ext的一些组件中常用的参数整理
2008-04-15 05:33 2515grid 中的render里的参数: value:当前单元格 ... -
Ext Docs(2.0) 本地化处理,已生成CHM文件了
2008-01-15 16:27 4296ext2 的chm文档 ajaxjs论坛上发现的 不敢独享~~ ...
相关推荐
NULL 博文链接:https://scmky.iteye.com/blog/1174740
以前有许多人需要将 tree 的节点拖拽到其他控件中的问题,前段时间已经解决了,现在也将它的源代码贡献上来。 这个树的数据是静态的,没有做动态的,而且树节点的拖拽也没有做过多的处理,如果要知道怎么样做树...
但是美中不足就是体积太大,前不久做项目的时候遇到这个问题,恰好发现里面一个压缩过的 Ext.js只有200K,但是已经能够构建一个完整的ExtTree,于是就花了点时间把它改造成一个xml To ExtTree的这样一个小控件,分享...
ext 级联选择的树形控件,有实例用法,不明白的请发邮件到cencai06@163.com
Ext的扩展控件,树形表格。!!!! Ext的扩展控件,树形表格。!!!!
因为项目的需求,实现一个可以编辑的tree,在网上找了一个牛人写的控件.Ext.ux.maximgb.tg.EditorGridPanel 把源码下载下来以后 不能运行,自己根据给出的列子,另写了一个小程序.不过并没有与数据库交互.
ext中,tree控件的详细应用,实例。
无论是界面之美,还是功能之强,ext的表格控件都高居榜首。 单选行,多选行,高亮显示选中的行,推拽改变列宽度,按列排序,这些基本功能咱们就不提了。 自动生成行号,支持checkbox全选,动态选择显示哪些列,支持...
无论是界面之美,还是功能之强,ext的表格控件都高居榜首。 单选行,多选行,高亮显示选中的行,拖拽改变列宽度,按列排序,这些基本功能ExtJS轻量级实现。 自动生成行号,支持checkbox全选,动态选择显示哪些列,...
让你知道ext表格控件的厉害。 2.1. 功能丰富,无人能出其右 2.2. 让我们搞一个grid出来耍耍吧。 2.3. grid默认自带的功能 2.4. 按顺序,咱们先要把常见功能讲到 2.4.1. 自主决定每列的宽度 2.4.2. 让grid支持按列...
ExtJS_配置和表格控件使用。Extjs入门培训教程。Extjs最经典的学习教程。ext布局。ext几个实例。EXT开发指南。EXT树简介。JavaScript使用手册。很多的extjs教程,你6分下载这个压缩包很值的,足足有三十几个教程文档...
详细说明了extjs中的树控件,正确无误的说明extjs树控件的强大之处
让你知道ext表格控件的厉害。 2.1. 功能丰富,无人能出其右 2.2. 让我们搞一个grid出来耍耍吧。 2.3. 上边那个是1.x的,2.0稍微有些不同哦 2.4. 按顺序,咱们先要把常见功能讲到 2.4.1. 自主决定每列的宽度 2.4.2. ...
6.3.2 在tree中使用Ext.Direct 181 6.3.3 为grid设置DirectStore 183 6.3.4 在form中使用Ext.Direct加载数据 185 6.3.5 在form中使用Ext.Direct提交数据 187 6.3.6 使用polling方式进行轮询 189 6.4 本章小结 191 第...
AnyFo - Util - Json4Ext Json4Ext项目背景 在大家开发的系统中,如果程序用ExtJS做表现层,那么就需要使ExtJS开发的界面和后台Java代码中生成的数据交互,一般来说,可以...4. ExtJS中的Tree控件需要的Json字符串
无论是界面之美,还是功能之强,ext的表格控件都高居榜首。 单选行,多选行,高亮显示选中的行,推拽改变列宽度,按列排序,这些基本功能咱们就不提了。 自动生成行号,支持checkbox全选,动态选择显示哪些列,...
支持用shift和ctrl来选择用户要拖动的树的节点和叶子。 功能非常强大。
无论是界面之美,还是功能之强,ext的表格控件都高居榜首。 单选行,多选行,高亮显示选中的行,推拽改变列宽度,按列排序,这些基本功能咱们就不提了。 自动生成行号,支持checkbox全选,动态选择显示哪些列...
让你知道ext表格控件的厉害。 2.1. 功能丰富,无人能出其右 2.2. 让我们搞一个grid出来耍耍吧。 2.3. 上边那个是1.x的,2.0稍微有些不同哦 2.4. 按顺序,咱们先要把常见功能讲到 2.4.1. 自主决定每列的宽度 ...
是从网上收集到的一些资料,里面主要包括Ext.form,Ext.grid,tree 的控件,可以直接复制出来使用,每个控件都写成独立的文件。都有注释