最近用了dhtmlxTree,关于它是什么,不用多说了,都知道它是一个优秀的树型结构。所以就用了它的带checkbox的树,当让用它就要做修改。
dhtmlxTree对xml文件格式要求的固定的第一个是tree,下面的子节点都是item,这个就要修改了dhtmlxtree.js中的dhtmlXTreeObject.prototype._parseXMLTree 方法里有
node = xml_obj.getXMLTopNode("book");改成自己的根节点名称就可以了。
子节点名称的修改:
还是刚才那个方法中
if ((node.childNodes[i].nodeType == 1) && ((node.childNodes[i].tagName == "unit") || (node.childNodes[i].tagName == "lesson")))
在后面的括号里添加自己的节点类型(tagName),同时在
dhtmlXTreeObject.prototype._branchUpdateNext方法中修改成
if(node.tagName == "unit")
{
var items = this.XMLLoader.doXPath("./unit", node);
}
else if(node.tagName == "lesson")
{
var items = this.XMLLoader.doXPath("./lesson", node);
}
好了,至此还可以修改文件使之适应自己的xml格式就告一段落。
接下来就是当选中各个方框后的触发各种行为,在此写个简单的例子供大家参考:
tree2 = new dhtmlXTreeObject("treeboxbox_tree2", "100%", "100%", 0);
tree2.setImagePath("../imgs/");
tree2.enableCheckBoxes(1);
tree2.enableThreeStateCheckboxes(true);
tree2.loadXML("test1.xml");
function haha()
{
alert("选中触发事件");//当然可在此编写相应的复杂逻辑。
}
tree2.attachEvent("onCheck", haha);
总结:这些只是大概的框架,复杂的还是编写自己的业务逻辑。就到这里吧,有问题再交流吧。
分享到:
相关推荐
DHtmlXTree应用指南,DHtmlXTree,DHtmlXTree教程,DHtmlXTree详细文档,DHtmlXTree使用例仔
dhtmlXtree树 右dhtmlXtree键菜单
DHTMLX 使用手冊版本 (Version):2.0.0 dhtmlxLayout是一个 JavaScript的DHTML的 组成部分,它提供了强大而有效的方式来建立 Ajax的Web界面 轻松。 该组件允许您以编程定义界面结构,包括大小元素及其布局。 最终...
专业版dhtmlxtree下载 专业版dhtmlxtree下载
dhtmlxtree和json的应用。自己写的练习项目,免费下载。
dhtmlxtree中文开发指导,简单介绍dhtmlxtree的使用。初学者适合。
dhtmlxtree例子
dhtmlxTree文档,代码都有,控件学习
包含dhtmlxTree(树型控件),dhtmlxTabbar(选项卡),dhtmlxGrid(数据表格),dhtmlxCombo(下拉选项),dhtmlxTreeGrid(树型表格),dhtmlxVault(文件上传控件),dhtmlxMenu(菜单),dhtmlxToolbar(工具条),dhtmlxCalendar(日历...
dhtmlxTree 树形控件 JavaScript
第三方树控件dhtmlxTree 3.6
DHtmlXTree 调用xml http://blog.csdn.net/ymc0329/article/details/6619796
dhtmlxtree构建动态维护树,介绍dhtmltree的构建以及修改!
dhtmlXTree1.6,js实现的树结构的目录
dhtmlxTree专业版
dhtmlxtree实例包括复选、右键菜单、拖拽等功能
JS 带右键菜单的目录树 dhtmlxtree+proto.menu 分权限 JS 带右键菜单的目录树 dhtmlxtree+proto.menu 分权限 图片预览 ...