`

dhtmlXTree中文API

阅读更多

dhtmlXTree是一个功能比较强大的树控件,基本上能满足大部分常规需求 

 

dhtmlXTree里面常用函数的说明:

 

构造函数
dhtmlXTreeObject(htmlObject, width, height, rootId)//rootId 虚拟根节点,在界面上不会显示,一般取值0

replace IMG tag with background images - solve problem with IE image caching , not works for IE6 SP1
enableIEImageFix(mode)

析构函数
destructor()

实现继承
clone()

节点构造函数
dhtmlXTreeItemObject(itemId,itemText,parentObject,treeObject,actionHandler,mode)// mode - do not show images

从xml字符串加载树
loadXMLString(xmlString,afterCall)//afterCall - function which will be called after xml loading

从xml文件加载树
loadXML(file,afterCall)

新建子节点,前三个参数为必须的
insertNewItem(parentId,itemId,itemText,itemActionHandler,image1,image2,image3,optionStr,childs)
insertNewChild(parentId,itemId,itemText,itemActionHandler,image1,image2,image3,optionStr,childs)

节点展开与收缩:[1-close 2-open]
_HideShow(itemObject,mode)

获取节点状态:0 - 没有子节点, -1 - 节点合拢, 1 - 节点展开
_getOpenState(node)
getOpenState(itemId)

获取选中的节点Id
getSelectedItemId()

选中节点
_selectItem(node,e)

获取节点的index
getIndexById(itemId)

设置鼠标右键点击事件
setOnRightClickHandler(func)

设置鼠标点击事件
setOnClickHandler(func)

设置节点状态改变事件
setOnSelectStateChange(func)

设置允许动态加载xml文件(异步加载)
setXMLAutoLoading(filePath)

设置checkbox点击事件
setOnCheckHandler(func)

设置节点展开/合拢事件
setOnOpenHandler(func)

设置节点开始展/合拢开事件
setOnOpenStartHandler(func)

设置节点展开/合拢结束事件
setOnOpenEndHandler(func)

设置节点双击事件
setOnDblClickHandler(func)

展开节点及下面所有子节点
_xopenAll(node)

//增加了不传递itemId的判断(1494)
openAllItems(itemId)//不传递itemId参数则合拢根节点

根据id获取节点
_globalIdStorageFind(itemId)

合拢节点及其下所有子节点
_xcloseAll(node)

//修改了原来逻辑的一个错误(1521)
closeAllItems(itemId)//不传递itemId参数则合拢根节点

为节点增加用户自定义的数据
//修正一个错误(1548)
setUserData(itemId,name,value)

获取用户自定义的数据
getUserData(itemId,name)

获取节点颜色
getItemColor(itemId)

设置节点颜色
setItemColor(itemId,defaultColor,selectedColor)

获取节点名称--(with HTML formatting, if any)
getItemText(itemId)

获取父节点id
getParentId(itemId)

更改节点id
changeItemId(itemId,newItemId)

标记被剪切的节点
doCut()

粘贴被剪切的节点到新的父节点下
doPaste(itemId)

清空被剪切的节点
clearCut()

移动节点
_moveNode(itemObject,targetObject)

允许三种状态的复选框(全选、不选、部分选中)
enableThreeStateCheckboxes(mode)// 1 - on, 0 - off;

设置鼠标悬浮事件
setOnMouseInHandler(func)

设置鼠标移走事件
setOnMouseOutHandler(func)

设置是否允许显示树图片
enableTreeImages=function(mode)//1 - on, 0 - off

设置是否允许固定模式(对于显示复选框的界面美观一些,但没有水平滚动条)
enableFixedMode(mode)// - 1 - on, 0 - off

是否显示复选框
enableCheckBoxes(mode, hidden)//mode 0/1 hidden 0/1

设置节点图片
setStdImages(image1,image2,image3)//a0 - image for node without childrens a1 - image for closed node a2 - image for opened node

设置是否显示树线
enableTreeLines(mode)

设置图片
setImageArrays(arrayName,image1,image2,image3,image4,image5)//image1 - line crossed image image2 - image with top line image3 - image with bottom line image4 - image without line image5 - single root image

展开当前节点(一节)
_openItem(node)
openItem(itemId)

合拢当前节点(一节)
closeItem(itemId)

获取节点的层节数
getLevel(itemId)

设置节点是否允许被合拢
setItemCloseable(itemId,flag)//flag 0/1

对于展开节点返回子节点数量,对于未加载子节点的节点(异步加载)返回true
hasChildren(itemId)

获取节点下的子节点数
_getLeafCount(itemNode)

设置节点名称
setItemText(itemId,newLabel,newTooltip)

获取节点tip
getItemTooltip(itemId)

刷新节点
refreshItem(itemId)

设置节点图片
setItemImage2(itemId, image1,image2,image3)//image1 - node without childrens image image2 - closed node image image3 - open node image

设置节点图片
setItemImage(itemId,image1,image2)//image1 - node without childrens image or closed node image (if image2 specified)  image2 - open node image (optional)

获取节点下所有子节点id以逗号分割
getSubItems(itemId)
getAllSubItems(itemId)

获取节点的所有子节点
_getAllScraggyItems(node)

获取选中节点的名称--(with HTML formatting, if any)
getSelectedItemText()

设置节点的选中状态
setCheck(itemId,state)//state - checkbox state (0/1/unsure)

设置节点及所有子节点的选中状态
setSubChecked(itemId,state)

获取节点的选中状态 return: node state (0 - unchecked,1 - checked, 2 - third state)
isItemChecked(itemId)

删除节点的所有子节点
deleteChildItems(itemId)

删除节点
deleteItem(itemId,selectParent) //selectParent - If true parent of deleted item get selection, else no selected items leaving in tree.

在节点下创建一个节点,前三个参数是必须的
insertNewNext(itemId,newItemId,itemText,itemActionHandler,image1,image2,image3,optionStr,childs)

根据index获取节点下子节点的id
getChildItemIdByIndex(itemId,index)//itemId 节点id

设置拖动事件
setDragHandler(func)

设置是否允许拖拽
//mode - enabled/disabled [ can be true/false/temporary_disabled - last value mean that tree can be D-n-D can be switched to true later ]
//rmode - enabled/disabled drag and drop on super root
enableDragAndDrop(mode,rmode)

设置是否允许IE缓存
preventIECashing=function(mode)//mode - enable/disable random seed ( disabled by default )

设置是否允许选中节点名称高亮显示
enableHighlighting(mode)//mode - 1 - on, 0 - off

是否允许图片可点击和拖拽(clickable and dragable)
enableActiveImages(mode)// mode - 1 - on, 0 - off

设置节点获得焦点
focusItem(itemId)

获取所有无子节点的节点id
getAllChildless()
getAllLeafs()

获取所有有子节点的节点id
getAllItemsWithKids()

获取所有被选中节点id,不包括第三中状态的节点(部分选中的节点)
getAllChecked()

获取所有被选中节点id,包括第三中状态的节点(部分选中的节点)
getAllCheckedBranches()

获取节点下所有未选中的节点id,不传递itemId表示从根节点开始查找
getAllUnchecked(itemId)

获取所有部分选中的节点id(因部分子节点选中而被选中的节点)
getAllPartiallyChecked()

设置节点样式
setItemStyle(itemId,style_string)

设置是否允许拖拽图片
enableImageDrag(mode)
set function called when tree item draged over another item
setOnDragIn(func)

设置拖拽是是否允许自动滚动
enableDragAndDropScrolling(mode)


补充说明:加载树时,必须确保所有节点的id不重复,否则控件会为重复id自动生成一个随机数(原id+"_"+当前日期)。
增加了一个dhtmlXTreeExtend.js对原类进行扩展,增加了getAllCheckedLeaf(),getAllUcCheckedLeaf()两个函数
修改了1个bug:
1 增加没有选中节点时执行展开/收缩选定节点时报没有parentId的bug
dhtmlXTreeObject.prototype.setSubChecked=function(itemId,state){
   if(itemId)
{
  var sNode=this._globalIdStorageFind(itemId);
  this._setSubChecked(state,sNode);
  this._correctCheckStates(sNode.parentObject);
}
}


1 增加了未传递itemId参数时默认从根节点展开
dhtmlXTreeObject.prototype.openAllItems=function(itemId)
   {
      if (itemId==window.undefined) itemId=this.rootId;
      var temp=this._globalIdStorageFind(itemId);
      if (!temp) return 0;
      this._xopenAll(temp);
   }

分享到:
评论

相关推荐

    DHtmlXTree中文使用手册2.0版本

    【DHTMLXTree中文使用手册2.0版本】 在DHTMLX组件库中,DHTMLXTree是一款基于JavaScript的DHTML组件,它主要用于构建富交互式的Web界面,特别是在Ajax技术的支持下,能实现动态更新和高效的数据展示。DHTMLXTree...

    dhtmlxtree中文开发指导

    ### dhtmlxtree中文开发指导 #### 一、简介 DHTMLXTree 是一款基于纯 JavaScript 的树形结构插件,适用于多种平台和技术栈。它支持 XML 数据格式,并且能够轻松地实现节点间的拖拽、复选框等功能。此外,该插件还...

    DHTMLX中文API开发手册

    ### DHTMLX中文API开发手册知识点概述 #### 1. DHTMLX介绍 DHTMLX是一个用于快速开发Web应用的JavaScript库集合,它包括多个组件,如日历、组合框、编辑器、布局管理器、菜单等。DHTMLX旨在提供丰富的用户界面元素...

    利用Dom4J 创建DhtmlXTree

    标签 "源码" 和 "工具" 提示我们可以找到实际的代码示例和相关资源,如提供的"DHtmlXTree应用指南.pdf",这可能包含详细的API参考和教程,帮助开发者更好地理解和使用DhtmlXTree。而"DHTMLX中文使用手册2.0版本.doc...

    dhtmlxSuite 4.0.3 Pro 专业版(内含 API 开发帮助文档)

    2. **中文API**:针对中国开发者,该版本特别提供了Grid组件的中文API,使得阅读和理解文档更加容易,减少了语言障碍。 **三、核心组件介绍** 1. **dhtmlxGrid**:这是一个功能丰富的数据网格组件,可以处理大量...

    dhtmlxSuite V4.0.3 Pro

    作为一个JavaScript UI库,它包含了一系列预设的、可自定义的控件和组件,如表格(dhtmlxGrid)、树形视图(dhtmlxTree)、日历(dhtmlxCalendar)、表单(dhtmlxForm)、面板(dhtmlxLayout)等。这些组件可以灵活...

    dhtmlxSuite含(dhtmlxTreeGrid)专业版本.zip

    6. **API与事件处理**:提供丰富的API接口和事件系统,便于进行扩展和定制,实现更复杂的业务逻辑。 7. **跨浏览器兼容**:dhtmlxSuite兼容多种主流浏览器,包括Chrome、Firefox、Safari、Edge和Internet Explorer...

    javascript树形菜单

    `dhtmlxtree.xml`可能是用于配置dhtmlxtree节点和结构的XML文件,`dhtmlxTree`和`dhtmlxTree1`可能是不同版本或者不同配置的库文件。 3. **xtree**: xtree可能是指另一款JavaScript树形菜单组件,但具体信息较少...

    DHTMLX tree中文帮助文档

    1. **高度自定义**:DHTMLX Tree 提供了丰富的API接口和选项,允许开发者根据需求定制界面样式和功能。 2. **高性能**:即使处理大量数据时也能保持良好的性能表现。 3. **易于集成**:可以轻松集成到现有的项目中,...

    开发者 1 资源0.1

    EXT 3.0中文文档.CHM可能是EXT框架的详细指南,帮助开发者理解和使用这个框架的各种功能。 2. **DHTML**:Dynamic HTML(DHTML)是一种利用HTML、CSS、JavaScript和DOM(Document Object Model)创建动态交互网页的...

    DHTMLX中文使用手册2.0版本

    dhtmlxLayout在2.0版本中的一大亮点是它与其他DHTMLX组件(如dhtmlxGrid、dhtmlxTree、dhtmlxWindows和dhtmlxMenu)的深度集成。这意味着你可以将这些功能强大的组件整合到同一界面中,为各种用途和布局提供一站式...

    dhtmlx使用手册

    它提供了多种组件,包括 dhtmlxLayout、dhtmlxGrid、dhtmlxTree、dhtmlxWindows、dhtmlxMenu 等,每个组件都具有其特点和优势。 dhtmlxLayout 是 dhtmlx 库中的一个重要组件,提供了强大而有效的方式来建立 Ajax 的...

    dhtmlTree样例

    4. **多语言支持**:虽然样例是英文版,但dhtmlTree本身支持多语言,可以通过配置实现中文显示。 5. **节点状态管理**:可以记录节点的展开/折叠状态,便于用户导航。 **三、API说明** dhtmlTree的API提供了多种...

    dhtmlx中文使用手册

    3. **dhtmlxTree**:用于展示层级结构的数据,支持拖放操作、图标显示、节点展开/折叠等特性,适用于构建导航菜单或文件管理器。 4. **dhtmlxAccordion**:一种空间利用效率高的布局工具,通过折叠/展开面板来展示...

    DHTMLX中文使用手册2.0版本pdf版本

    在讨论DHTMLX中文使用手册2.0版本pdf版本之前,先简要介绍DHTMLX本身。DHTMLX是一套先进的JavaScript UI组件库,它使得开发者可以更容易地构建出功能丰富的Web应用程序。该库支持Ajax、拥有丰富API,能够帮助开发者...

    dhtmlx及帮助文档

    3. **API和事件**:每个组件都有丰富的API,允许开发者控制组件的行为。同时,dhtmlx提供了一系列的事件,比如点击、选中、加载等,开发者可以通过监听这些事件来实现自定义逻辑。 4. **主题和皮肤**:dhtmlx允许...

    DHTMLX中文使用手册2.0版本.doc

    中文使用手册2.0版本详细介绍了如何利用这个库的各种控件来创建Ajax驱动的网页界面。DHTMLX的核心在于其组件化的架构,使得开发者能够灵活地构建复杂且响应式的用户界面。 **dhtmlxLayout**是DHTMLX库中的一个重要...

Global site tag (gtag.js) - Google Analytics