mini.Tree

树形控件。

Extend

mini.Control

Usage

<ul id="tree1" class="mini-tree" url="../data/tree.txt" style="width:300px;padding:5px;" 
    showTreeIcon="true" textField="text" idField="id" >        
</ul>

Screenshots

Examples

Base Example Create Tree Lazy Tree Navigation Tree Selection ContextMenu
Add/Remove/Update Node Expand/Collapse Draw Node MoveNode Window

Properties

NameTypeDescriptionDefault Set? Get? Tag?
data Array 树形数据对象
url String 数据加载地址
value String 选中的节点值
idField String 值字段。 id
textField String 节点文本字段 text
iconField String 图标字段 iconCls
nodesField String 子级节点字段 children
parentField String 父节点字段 pid
resultAsTree Boolean url数据是否列表 true
showTreeIcon Boolean 显示节点图标 true
showTreeLines Boolean 显示树形线条 true
allowSelect Boolean 允许选择节点 true
showCheckBox Boolean 允许Check模式选中节点 false
showFolderCheckBox Boolean 当showCheckBox为true时,是否显示父节点CheckBox true
showExpandButtons Boolean 显示折叠展开图标 true
enableHotTrack Boolean 移动节点上时高亮显示 true
allowDrag Boolean 是否允许拖拽节点 false
allowDrop Boolean 是否允许投放节点 false
dragGroupName String 拖拽组名
dropGroupName String 投放组名

Methods

NameParameterDescriptionReturn
load ( url ) 加载数据。
loadData ( Array ) 加载树形数据。
getRootNode ( ) 获取根节点。 Object
getParentNode ( node ) 获得父节点 Object
getChildNodes ( node ) 获得子节点集合。 Array
isAncestor ( pnode, node ) pnode是否是node的父级节点。 Boolean
isLeaf ( node ) 是否叶子节点。
getLevel ( node ) 获得节点层级。 Number
isExpandedNode ( node ) 是否展开节点。 Boolean
isCheckedNode ( node ) 是否Check选中的节点。 Boolean
isVisibleNode ( node ) 是否显示节点。 Boolean
isEnabledNode ( node ) 是否启用节点。 Boolean
bubbleParent ( node, fn, scope ) 由当前节点开始一直上溯到根节点,调用fn,直到fn返回false为止。 Control
cascadeChild ( node, fn, scope ) 遍历所有层次的子节点, 直到返回false
eachChild ( node, fn, scope ) 遍历下一级子节点
removeNodes ( nodes ) 删除多个节点
removeNode(node) 删除节点
addNodes ( nodes, parentNode ) 增加多个节点
addNode ( node, index, parentNode ) 加入节点
setNodeText ( node, String ) 设置节点文本
setNodeIconCls ( node, String) 设置节点图标
getNode ( value ) 根据值获取节点对象
hideNode ( node ) 隐藏节点
showNode ( node ) 显示节点
enableNode ( node ) 启用节点
disableNode ( node ) 禁用节点
expandNode ( node ) 展开节点
collapseNode ( node ) 收缩节点
expandLevel ( Number ) 展开层次节点
collapseLevel ( Number ) 折叠层次节点
expandAll ( ) 展开所有节点
collapseAll ( ) 收缩所有节点
selectNode ( node ) 选中节点
getSelectedNode ( ) 获取选中的节点
checkNode ( node ) Check多选节点
uncheckNode ( node ) 取消Check多选节点
checkNodes ( nodes ) Check多选多个节点
uncheckNodes ( nodes ) 取消Check多选多个节点
checkAllNodes ( ) Check多选所有节点
uncheckAllNodes ( ) 取消Check多选所有节点
getCheckedNodes ( ) 获取Check选中的多个节点
getValue ( ) 获取Check选中的节点值

Events

NameEventObjectDescription
drawnode
{
  sender: Object,         //树对象
  node: Object,           //节点对象
  isLeaf: Boolean,        //是否叶子
  nodeHtml: String,       //节点html
  showCheckBox: Boolean,  //是否显示checkbox
  iconCls: String,        //图标样式
  showTreeIcon: Boolean   //是否显示图标
}
绘制节点时发生
nodedblclick
{
  sender: Object,         //树对象
  node: Object,           //节点对象
  isLeaf: Boolean
}
节点双击时发生
nodeclick
{
  sender: Object,         //树对象
  node: Object,           //节点对象
  isLeaf: Boolean
}
节点点击时发生
nodemousedown
{
  sender: Object,         //树对象
  node: Object,           //节点对象
  isLeaf: Boolean
}
节点鼠标按下时发生
beforenodeselect
{
  sender: Object,         //树对象
  node: Object,           //节点对象
  isLeaf: Boolean,
  cancel: false
}
选择节点前发生
nodeselect
{
  sender: Object,         //树对象
  node: Object,           //节点对象
  isLeaf: Boolean
}
节点选中时发生
beforeload 数据加载前发生
preload 数据加载,设置到Tree前发生
loaderror 数据加载错误时发生
load 数据加载成功时发生
beforenodecheck
{
  sender: Object,         //树对象
  node: Object,           //节点对象
  isLeaf: Boolean,
  checked: Boolean,       //Check状态
  cancel: false
}
Check选择前发生
nodecheck
{
  sender: Object,         //树对象
  node: Object,           //节点对象
  isLeaf: Boolean
}
Check选择时发生
beforeexpand
{
  sender: Object,         //树对象
  node: Object
}
展开节点前发生
expand
{
  sender: Object,         //树对象
  node: Object
}
展开节点后发生
beforecollapse
{
  sender: Object,         //树对象
  node: Object
}
折叠节点前发生
collapse
{
  sender: Object,         //树对象
  node: Object
}
折叠节点后发生