- 浏览: 82915 次
- 性别:
- 来自: 北京
文章分类
最新评论
-
sfc235300:
假如我传的一个参数为name=李连杰后台request.get ...
jQuery Ajax 传中文参数出现乱码(传值,乱码)
config定义{
animate : Boolean,
containerScroll : Boolean,
ddAppendOnly
: String, /*很显然这是api的一个错误,treepanel.js中惟一用到它的地方是this.dropZone = new
Ext.tree.TreeDropZone(this, this.dropConfig || {
ddGroup: this.ddGroup || "TreeDD", appendOnly: this.ddAppendOnly === true
})
只有没有定义dropConfig才会影响ddconfig的appendOnly,原api说明是
True if the tree should only allow append drops 只有当值为真时才允许以追加的方式接受拖曳*/
ddGroup : String,
ddScroll : Boolean,
dragConfig : Object,
dropConfig : Object,
enableDD : Boolean,
enableDrag : Boolean,
enableDrop : Boolean, //以上参数更应该放在Ext.dd中学习
hlColor : String, //高亮颜色
hlDrop : Boolean //曳入时高亮显示?
lines : Boolean //显示树形控件的前导线
loader : Ext.tree.TreeLoader //这是个重要的参数,用于方便的构建树形菜单,用于远程调用树状数据
pathSeparator : String //默径分隔符.默认为/
rootVisible : Boolean //根可见?这是个有趣的属性,因为树只能有且仅有一个根,当我们需要两个或更多的"根"时就要用它了
selModel
: Boolean /*选择模式,默认的是一个Ext.tree.DefaultSelectionModel实例,也可以是
Ext.tree.MultiSelectionModel,如果你有兴趣,还可以自己定义,当然,它绝对不是一个布尔值
另,虽然内置的两种选择
方式都支持getSelectedNodes和clearSelections()
方法,但treenode中好象只用到的select/unSelecte/isSelected,如果自己继承写SelectionModel应该至少
支持这三个方法
*/
singleExpand : Boolean //在所有的兄弟节点中只能有一个被展开
属性
dragZone : Ext.tree.TreeDragZone
dropZone : Ext.tree.TreeDropZone
root : Node //最重要的也就是这个属性了
方法
TreePanel( Object config )
构造
collapseAll() : void
expandAll() : void
收起展开所有节点
expandPath( String path, [String attr], [Function callback] ) : void
由path找到节点,展开树到此节点
getChecked( [String attribute], [TreeNode startNode] ) : Array
返回一个包含所有选中节点的数组.或者所有选中节点的属性attribute组成的数组
getEl() : Element
返回当前TreePanel的容器对象
getLoader() : Ext.tree.TreeLoader
当前所使用的TreeLoader对象
getNodeById( String id ) : Node
由指定的节点id找到节点对象
getRootNode() : Node
得到根节点,同属性root
getSelectionModel() : TreeSelectionModel
得到选择模式
getTreeEl() : Ext.Element
返回当前tree下面的元素
selectPath( String path, [String attr], [Function callback] ) : void
由path选择指定的节点,它事实上调用的是expandPath用于展开节点对象
setRootNode( Node node ) : Node
设置根节点
事件
append : ( Tree tree, Node parent, Node node, Number index )
beforeappend : ( Tree tree, Node parent, Node node )
beforechildrenrendered : ( Node node )
beforeclick : ( Node node, Ext.EventObject e )
beforecollapsenode : ( Node node, Boolean deep, Boolean anim )
beforeexpandnode : ( Node node, Boolean deep, Boolean anim )
beforeinsert : ( Tree tree, Node parent, Node node, Node refNode )
beforeload : ( Node node )
beforemove : ( Tree tree, Node node, Node oldParent, Node newParent, Number index )
beforenodedrop : ( Object dropEvent )
beforeremove : ( Tree tree, Node parent, Node node )
checkchange : ( Node this, Boolean checked )
click : ( Node node, Ext.EventObject e )
collapsenode : ( Node node )
contextmenu : ( Node node, Ext.EventObject e )
dblclick : ( Node node, Ext.EventObject e )
disabledchange : ( Node node, Boolean disabled )
dragdrop : ( Ext.tree.TreePanel this, Ext.tree.TreeNode node, DD dd, event e )
enddrag : ( Ext.tree.TreePanel this, Ext.tree.TreeNode node, event e )
expandnode : ( Node node )
insert : ( Tree tree, Node parent, Node node, Node refNode )]
load : ( Node node )
move : ( Tree tree, Node node, Node oldParent, Node newParent, Number
nodedragover : ( Object dragOverEvent )
nodedrop : ( Object dropEvent )
remove : ( Tree tree, Node parent, Node node )
startdrag : ( Ext.tree.TreePanel this, Ext.tree.TreeNode node, event e )
textchange : ( Node node, String text, String oldText )
Ext.tree.TreeNode
树状控件的节点类,继承自Ext.data.Node
config{
allowChildren : Boolean
allowDrag : Boolean
allowDrop : Boolean
checked : Boolean //无论设为真还是假都会在前面有个选择框,默认未设置
cls : String
disabled : Boolean
draggable : Boolean
expandable : Boolean
expanded : Boolean
href : String //超链接
hrefTarget : String
icon : String //图标
iconCls : String
isTarget : Boolean //是拖曳的目标?
qtip : String //提示
qtipCfg : String //
singleClickExpand : Boolean //单击展开
text : String //文本内容
uiProvider : Function //默认Ext.tree.TreeNodeUI,如果想自己提供ui可以自已再继承Ext.tree.TreeNodeUI
}
属性
disabled : Boolean
text : String
ui : TreeNodeUI //此属性只读.参见uiProvider
方法
TreeNode( Object/String attributes )
构造
collapse( [Boolean deep], [Boolean anim] ) : void
收起本节点
collapseChildNodes( [Boolean deep] ) : void
收起子节点
disable() : void
enable() : void
禁止允许
ensureVisible() : void
确保所有的父节点都是展开的
expand( [Boolean deep], [Boolean anim], [Function callback] ) : void
展开到当前节点
expand( [Boolean deep], [Boolean anim], [Function callback] ) : void
展开本节点
expandChildNodes( [Boolean deep] ) : void
展开所有的子节点
getUI() : TreeNodeUI
返回ui属性
isExpanded() : Boolean
当前节点是否展开
isSelected() : Boolean
当前节点是否选择
select() : void
选择当前节点
setText( String text ) : void
设置当前节点的文本
toggle() : void
在展开或收起状态间切换
unselect() : void
取消选择
事件
beforechildrenrendered : ( Node this )
beforeclick : ( Node this, Ext.EventObject e )
beforecollapse : ( Node this, Boolean deep, Boolean anim )
beforeexpand : ( Node this, Boolean deep, Boolean anim )
checkchange : ( Node this, Boolean checked )
click : ( Node this, Ext.EventObject e )
collapse : ( Node this )
contextmenu : ( Node this, Ext.EventObject e )
dblclick : ( Node this, Ext.EventObject e )
disabledchange : ( Node this, Boolean disabled )
expand : ( Node this )
textchange : ( Node this, String text, String oldText )
Ext.tree.AsyncTreeNode
继承自Ext.tree.TreeNode,支持异步创建,很显然除了多个loader与TreeNode没什么区别
config{
loader : TreeLoader
}
属性
loader : TreeLoader
方法
AsyncTreeNode( Object/String attributes )
isLoaded() : Boolean
isLoading() : Boolean
reload( Function callback ) : void
事件
beforeload : ( Node this )
load : ( Node this )
Ext.tree.TreeNodeUI
为节点输出而设计,如果想创建自己的ui,应该继承此类
方法
addClass( String/Array className ) : void
增加样式类
getAnchor() : HtmlElement
返回<a>元素
getIconEl() : HtmlElement
返回<img>元素
getTextEl() : HtmlNode
返回文本节点
hide() : void
隐藏
isChecked() : Boolean
选中?
removeClass( String/Array className ) : void
移除样式
show() : void
显示
toggleCheck( Boolean (optional) ) : void
切换选中状态
Ext.tree.RootTreeNodeUI
api上说它继承自object,事实上treenodeui它中继承自Ext.tree.TreeNodeUI,也只有这样才合理,用于输出根节点
Ext.tree.TreeLoader
用于远程读取树状数据来构造TreeNode的子节点
config{
baseAttrs : Object //构造子节点的基础属性
baseParams : Object //请求url的传入参数
clearOnLoad : Boolean //重新载入前先清空子节点
dataUrl : String //远程请求时的url
preloadChildren : Boolean //节点第一次载入时递归的载入所有子孙节点的children属性
uiProviders : Object //ui提供者
url : String //等同于dataUrl
}
方法
TreeLoader( Object config )
构造
createNode() : void
创建节点,treeloader.js中定义的是createNode : function(attr),传入的应该是一个定制的节点
load( Ext.tree.TreeNode node, Function callback ) : void
为node载入子节点
事件
beforeload : ( Object This, Object node, Object callback )
load : ( Object This, Object node, Object response )
loadexception : ( Object This, Object node, Object response )
Ext.tree.TreeSorter
排序
config{
caseSensitive : Boolean//大小写敏感,默认为false
dir : String //正序还是倒序,可选asc/desc.默认asc
folderSort : Boolean //叶节点排在非叶节点之下 ,默认为真
leafAttr : String //在folderSort中排序时的使用的属性,默认为leaf
property : String //用于排序的属性.默认为text
sortType : Function //可以通过特定的sortType先转换再排序
}
方法
TreeSorter( TreePanel tree, Object config )
构造
Ext.tree.TreeFilter
过滤器
clear() : void
清除当前过滤器
filter( String/RegExp value, [String attr], [TreeNode startNode] ) : void
filterBy( Function fn, [Object scope] ) : void
使用过滤器,但正如api中所说的,这是个实验性的数,还有很多不足,基本上很难真的作用
惯例来个小示例
Ext.onReady(function() {
//建立树
var tree=new Ext.tree.TreePanel( {
el:Ext.getBody(),
autoScroll:true,
animate:true,
height:200,
enableDD:true,
containerScroll: true
});
//建立根
var root = new Ext.tree.TreeNode( {
text: 'Ext JS',
draggable:false,
id:'root'
});
//设置根
tree.setRootNode(root);
tree.render();
//增加子节点
root.appendChild(new Ext.tree.TreeNode( {
text: 'csdn',
href:'http://www.csdn.net',
id:'node_csdn'
}));
root.appendChild(new Ext.tree.TreeNode( {
text: 'duduw',
href:'http://www.duduw.com',
id:'duduw_Node'
}));
//设置属性
tree.root.attributes.description='这是根节点';
//getNodeById
tree.getNodeById('duduw_Node').attributes.description='这是叶节点';
//选择第一个子节点
tree.selectPath('/root/node_csdn');
//事件
tree.on('click',function(node,e) {
e.stopEvent();
if(node.attributes.description) {
Ext.MessageBox.show( {title:'您选择了',
msg:String.format("description:{0}<br/>href:{1}",node.attributes.description,node.attributes.href)
});
}
});
});
发表评论
-
Ext grid中在条件下显示或不显示某些列
2011-08-12 14:52 1117//#region当合同资金类型为付款时,列表显示开户银行和账 ... -
ExtJs中的ComboBox详细说明
2011-08-08 16:53 2888Ext.form.ComboBox属性及常用方法详解 2010 ... -
从grid中一次删除多条数据
2011-08-05 15:53 981/** * 删除自定义字段 */ ... -
遍历grid下某一个字段的总和
2011-08-03 15:08 1323{ layout : 'fit', ... -
从Grid 获得 JSON 数据
2011-08-02 11:19 1106/** * 从Grid 获得 JSON 数据 ... -
隐藏显示tabpanel中的items
2011-07-28 11:28 1218xtype : 'tabpanel', ... -
最小长度与最大长度验证
2011-07-21 12:25 1329//取值范围(选择数字时显示) ... -
Ext.自动适应宽度
2011-07-19 12:04 932var setting_customfieldslist_g ... -
Ext.Tree扩展CheckBox方法
2011-07-15 12:16 984/////引入这个JS: Ext.ux.tree.Tre ... -
Extjs 列表中牢定不显示fixed
2011-07-15 11:03 816header :"所属项目" ... -
Form 和 Grid之间切换,列表和增删改
2011-07-08 15:56 821//Store contractAction.contrac ... -
Ext中封装的几个function
2011-07-06 10:07 679/** * 拼一个请求地址 ... -
JS中的try catch
2011-07-04 16:09 1182try{ //要调试的JS代码段 ... -
Ext智能提示 - Spket(Visual Studio 2008 插件)
2011-07-04 09:16 994Visual Studio 2008的Ext 2.0 ... -
Ext2.0 form使用实例
2011-06-23 11:55 702Ext2.0 的 form 不单增加了时间输入控件、隐藏 ... -
新建的时候给文本框附值(自己记录的备忘)
2011-06-21 10:28 733前台JS: //#region获取供 ... -
[转载]Ext.data-GroupingStore/JsonStore/SimpleStore
2011-06-10 09:48 970[转载]Ext.data-GroupingStore/ ... -
EXT2.0 grid 统计 sum
2011-06-10 09:45 1843EXT2.0 grid 统计 sum(转自#$%^& ... -
Ext同步与异步请求(转自garnettcwm)
2011-06-01 15:43 1149EXTJS 同步和异步请求 ... -
Ext一些方法的重写
2011-05-25 12:12 805重写了Ext2.2的一些方法,比如tableform等
相关推荐
可实现选中父节点,自动选中子节点,选中子节点,自动遍历选中父节点
目录 1. ExtJs2.0学习系列(1)--Ext.MessageBox 2. ExtJs2.0学习系列(2)--Ext.Panel 3. ExtJs2.0学习系列(3)--...14. ExtJs2.0学习系列(14)--Ext.TreePanel之第三式(可增删改的树) 15. ExtJs2.0学习系列(15)--extjs换肤
完美的Extjs4 treePanel节点刷新,函数为自动刷新选中的节点.API看得头疼才别出来的代码.截止我发之前,好像没有谁共享这个功能的函数吧.
treepanel 和 tabpanel 合在一起使用,可直接使用
关于Ext Tree Panel,相关的知识文档
FileTreePanel扩展至Ext.tree.TreePanel附带基本的文件/文件夹管理功能 其它还包括文件上传,重命名
通过DWR动态加载Ext.tree.TreePanel。
代码如下: //树 var treePanel = new Ext.tree.TreePanel({ id:’ptree’, region:’west’, layout:’anchor’, border:false, rootVisible: false, root:{}, listeners:{ render: function() { authorityTree...
级联树,checkbox 大数据量,支持多种操作 简单易用
.x-tree-node-collapsed .x-tree-node-icon { background:transparent url(web/css/images/default/tree/1.gif); } .x-tree-node-expanded .x-tree-node-icon { background:transparent url(web/css/images/default...
NULL 博文链接:https://maoyi606.iteye.com/blog/1782825
学习YUI.Ext 第六天--关于树TreePanel(Part 1)
var tree = new Tree.TreePanel({ el:'tree-div', useArrows:true, autoScroll:true, animate:true, enableDD:true, containerScroll: true, // auto create TreeLoader dataUrl: 'get-nodes.php', root...
其中Ext.tree.TreeNode代表一个树节点,比较常用的属性包括text、id、icon、checked等、异步树Ext.tree.AsyncTreeNode、树加载器Ext.tree.TreeLoader。下面介绍Extjs 中的 Treepanel 实现菜单级联选中效果。 在 ...
代码如下: var tree = new Ext.tree.TreePanel({ region:’west’, title:’站点树:’, width:200, minSize:150, maxSize:200, iconCls:’ux-auth-menu-header-icon’, split:true, autoScroll:true, autoHeight:...
学习YUI.Ext 第六天--关于树TreePanel(Part 2异步获取节点)
代码如下: var Fpanel = new Ext.tree.TreePanel({ id:’ptree’, region:’west’, layout:’anchor’, border:false, rootVisible: false, root:new Ext.tree.AsyncTreeNode({}), listeners:{ “checkchange”: ...
关于TreePanel的一些文档,有点杂,不过内容比较多
获取Extjs中的TreePanel中所有的被checked的叶子节点的id
TreePanel的checkbox节点操作及父子节点联动的演示DEMO