介绍现在项目中使用到的dojo tree

      

      在我们项目中也如上篇文章介绍的那样，使用dojo中的dijit.tree，如下代码所示，大家可以看出，动态语言给我们很充足的可编程性。 主要提供：打开节点、拖拽排序等常用功能。

       
        //创建数据源，确定基本根节点以及其children节点
	var treeItems  = [ {
		id : "root",
		displayNameCh : _rootLabel,
		displayNameEn : _rootLabel,
		children : allItems
	} ];
				
	this.loadTreeByData (treeItems);

        loadTreeByData : function(/*数据源*/treeItems){
		
		
		var localeName = dojo.locale;
		var displayName = "";

               //国际化设置
		if (localeName == "zh" || localeName == "zh-cn") {
			displayName = "displayNameCh";
		} else {
			displayName = "displayNameEn";
		}
		
		var data = {
			identifier : "id",
			label : displayName,
			items : treeItems
		};

               //把数据源treeItems包装一下
		this.workStore = new dojo.data.ItemFileWriteStore({
			data : data
		});
		
                //根据TreeStoreModel特性来创建tree所需model
		this.workModel = new dijit.tree.TreeStoreModel({
			store : this.workStore,
			childrenAttrs : [ "children" ]
		});

                //存在tree，则销毁
		if (this.workTree) {
			this.logger.debug("Destroy old tree");
			if (this.workTree.destroyRecursive) {
				this.workTree.destroyRecursive();
			} else if (this.workTree.destroy) {
				this.workTree.destroy();
			}
			this.workTree = null;
		}

               //创建tree单元，这里使用了一些tree相关的高级应用
		this.workTree = new dijit.Tree({
			model : this.workModel,
			openOnClick : false,
			dndController : "dijit.tree.dndSource",
			betweenThreshold : 5,
			onOpen : dojo.hitch(this, this.onRetrieveTag),
			onClick : dojo.hitch(this, this._onClickItem),
			onDblClick : dojo.hitch(this, this._onDbClickItem),
			checkItemAcceptance : dojo.hitch(this, this.onCheckItemAcceptance),
			persist : false
		});

		this.workTree.placeAt(this.containerNode);
		this.startup();
		
                //用于处理树节点之间的拖拽响应
		this.connect(this.workTree.dndController, 'onMouseDown', function(e) {
			// 如果你的树上有滚动条，请加入如下代码，否则如果你选中了节点后拖动滚动条会出现节点拖拽
			if (dijit.getEnclosingWidget(e.target) == this.workTree) {
				this.workTree.dndController.mousedown = false;
				return;
			}
		});
	},