zTree 两棵树同步拖拽异常

tomato211 发布于 2015/08/24 18:43
阅读 833
收藏 0

@zTree 你好,想跟你请教个问题:我在一个页面上 构建了两棵树,分别使用了setting1和setting2异步加载。现在我想 使用zTree的拖拽功能,从A树拖拽节点到B树,同步两棵树的节点。我重写了beforeDrop 回调函数,在拖拽时校验A树拖过来的节点在B树是否存在,如果存在则提示,返回false。理论上讲这时候 两棵树的节点应该都没有变化。可实际情况是A树节点被同步到了B树。请大牛帮忙看看。。。谢谢

/**
 * 全局变量,存放树的改动
 */
var optList = new Array();

function opt(opr, sourceNode, targetNode) {
	this.opr = opr;
	this.targetNode = targetNode;
	this.sourceNode = sourceNode;
}

function dpTreeNOde(id,name,pId,absPath){
	this.id = id;
	this.name = name;
	this.pId = pId;
	this.absPath = absPath;
	
}

/** ztree的参数配置,* */
var setting = {
	check : {
		/** 复选框* */
		enable : true,
		chkDisabledInherit : false,
		chkStyle : "checkbox",
		chkboxType : {
			"Y" : "s",
			"N" : "s"
		}
	},
	edit : {
		enable : true,
		showRemoveBtn : true,
		showRenameBtn : true
	},
	view : {
		expandSpeed : 300
	},
	async : {
		enable : true,
		type : 'post',
		contentType : "application/x-www-form-urlencoded",
		url : "deployTree/asynProjectTree.do",
		autoParam : [ "id", "name", "pId" ],
		dataFilter : filter
	},
	data : {
		simpleData : { // 简单的数据源, 
			enable : true,
			idKey : "id",  
			pIdKey : "pId",
			rootPId : 1
		 
		}
	},
	callback : {
		/** 回调函数的设置* */
	 
		onClick : zTreeOnClick,
		beforeDrag : beforeDrag,
		beforeDrop : beforeDrop,
		onDrag : zTreeOnDrag,
		onDrop : zTreeOnDrop,
		beforeRemove : zTreeBeforeRemove,
		beforeRename : zTreeBeforeRename

	}
};
function zTreeBeforeRename(treeId, treeNode, newName, isCancel) {
	/**将修改删除节点存入全局缓存**/

	optList.push(new opt('R', treeNode));
	return true;
}
function zTreeBeforeRemove(treeId, treeNode) {
	/**将修改删除节点存入全局缓存**/
	optList.push(new opt('D', treeNode, null));
	return true;
}
 
function zTreeOnClick(e, treeId, treeNode) {

	var zTree = $.fn.zTree.getZTreeObj("tree1");
	zTree.expandNode(treeNode);
}
function setCheck() {
	var zTree = $.fn.zTree.getZTreeObj("tree1"), type = {
		"Y" : "s",
		"N" : "s"
	};
	zTree.setting.check.chkboxType = type;
 
}
$(document).ready(
		function() {
			// 初始化ztree对象
			var pkDetailId = $("#pkDetailId").val();
			setting.async.url = "deployTree/asynProjectTree.do?pkDetailId="
					+ pkDetailId;
			var zTreeDemo = $.fn.zTree.init($("#tree1"), setting);
			setCheck();

		});
function beforeDrag(treeId, treeNodes) {
	for (var i = 0, l = treeNodes.length; i < l; i++) {
		if (treeNodes[i].drag === false) {
			return false;
		}
	}
	return true;
}
 
function zTreeOnDrag(event, treeId, treeNodes) {

};
function zTreeOnDrop(event, treeId, treeNodes, targetNode, moveType) {

};

function beforeDrop(treeId, treeNodes, targetNode, moveType) {
	var treeObj = $.fn.zTree.getZTreeObj("tree1");
	var ids = [];
	// 获得目标树的节点属性,文件夹则遍历判断是否有同名,并提示覆盖
	if (targetNode.isParent == false) {
		$.messager.alert('警告', "文件节点不允许添加子文件!");
		return false;
	} else {
		// 传过来的是文件夹则提示合并
		var tmpNode = treeNodes[0];
		if (tmpNode.isParent == true) {
			// 同名则提示合并
			if (tmpNode.name == targetNode.name) {
				$.messager
						.confirm('Confirm', '源文件夹与目标文件夹同名,是否覆盖?',
								function(r) {
									if (r) {
										optList.push(new opt('C', tmpNode,
												targetNode));
										/***刷新树***/
										treeObj.refresh();
										return true;
									} else {

										return false;
									}
								});
			} else {
				ids = targetNode.children;
				for (var i = 0; i < ids.length; i++) {
					if ((ids[i].isParent == true)
							&& (ids[i].name == tmpNode.name)) {
						$.messager.confirm('Confirm', '目标文件夹内存在同名文夹,是否覆盖?',
								function(r) {
									if (r) {
										optList.push(new opt('C', tmpNode,
												targetNode));
										return true;
									} else {
										return false;
									}
								});
					}

				}
				return true;
			}
			// 如果是文件则遍历文件夹的子文件,如果同名则提示合并
		} else {
			ids = targetNode.children;
			for (var i = 0; i < ids.length; i++) {
				if ((ids[i].isParent == false) && (ids[i].name == tmpNode.name)) {
					$.messager.confirm('Confirm', '源文件夹与目标文件夹内存在同名文件,是否覆盖?',
							function(r) {
								if (r) {
									optList.push(new opt('C', tmpNode,
											targetNode));
									return true;
								} else {
									return false;
								}
							});
				}

			}
			return true;

		}
	}
}

// ids是一个数组 返回结果数组 treeNode是选中的节点
function getChildren(ids, treeNode) {
	ids.push(treeNode.id);
	if (treeNode.isParent) {
		for ( var obj in treeNode.children) {
			getChildren(ids, treeNode.children[obj]);
		}
	}
	return ids;
}
function filter(treeId, parentNode, childNodes) {

	if (!childNodes)
		return null;
	for (var i = 0, l = childNodes.length; i < l; i++) {

		childNodes[i].name = childNodes[i].name.replace('', '');
		childNodes[i].isParent = childNodes[i].parent;
		childNodes[i].drag = true;
		childNodes[i].drop = true;
	}
	return childNodes;
}
var setting1 = {
	check : {
		/** 复选框* */
		enable : true,
		chkDisabledInherit : false,
		chkStyle : "checkbox",
		chkboxType : {
			"Y" : "s",
			"N" : "s"
		}
	},
	edit : {
		enable : true,
		showRemoveBtn : false,
		showRenameBtn : false
	},
	view : {
		expandSpeed : 300
	},
	async : {
		enable : true,
		type : 'post',
		contentType : "application/x-www-form-urlencoded",
		url : "deployTree/loadLocalFileSystem.do",
		autoParam : [ "id", "name", "pId", "absPath" ],
		// otherParam: {:},
		dataFilter : filter
	},
	data : {
		simpleData : {  
			enable : true,
			idKey : "id",  
			pIdKey : "pId",
			rootPId : 1
		// 根节点
		}
	},
	callback : {
		/** 回调函数的设置 * */
		onClick : zTreeOnClick2,
		beforeDrag : beforeDrag,
		beforeDrop : beforeDrop
	}
};
function zTreeOnClick2(e, treeId, treeNode) {

	var zTree2 = $.fn.zTree.getZTreeObj("tree2");
	zTree2.expandNode(treeNode);
}
function filter2(treeId, parentNode, childNodes) {
	if (!childNodes)
		return null;
	for (var i = 0, l = childNodes.length; i < l; i++) {
		childNodes[i].name = childNodes[i].name.replace('', '');
		childNodes[i].isParent = childNodes[i].parent;
	}
	return childNodes;
}
function laodLocalFile() {

	var path = $("#localPath").val();
	path = encodeURI(encodeURI(path));
	setting1.async.url = "deployTree/loadLocalFileSystem.do?localPath=" + path;

	$.fn.zTree.init($("#tree2"), setting1);

}

function publish() {
	
	alert(optList.length)
 
		for (var i = 0, l = optList.length; i < l; i++) {
			
//			$.messager.alert('警告', optList[i].sourceNode.name);
			var tmpSrc = new dpTreeNOde(optList[i].sourceNode.id,optList[i].sourceNode.pId,optList[i].sourceNode.name,optList[i].sourceNode.absPath);
			optList[i].sourceNode = tmpSrc;
			if(optList[i].targetNode != null){
				var tmpDes = new dpTreeNOde(optList[i].sourceNode.id,optList[i].sourceNode.pId,optList[i].sourceNode.name,optList[i].sourceNode.absPath);
				optList[i].targetNode = tmpDes;
			}
			
		}

	//	开启遮罩
	$.messager.progress({
		title : 'Please waiting',
		msg : 'Loading data...',
		text : 'PROCESSING.......'
	});
	var jsonText = JSON.stringify(optList);  
	$.ajax({
		type : "POST",
		url : "deployTree/asynDeployTree.do",
		contentType : "application/json; charset=utf-8",
		data :  {optList:jsonText},
		dataType : "json",
		success : function(res) {
			//关闭遮罩
			$.messager.progress('close');
			if (res.flag == 'true') {
				$.messager.alert('提示', res.msg);
			} else {
				$.messager.alert('警告', res.msg);
			}
		},
		error : function() {
			//关闭遮罩
			$.messager.progress('close');
			$.messager.alert('警告', 'Ajax 请求失败!');
		}
	});

}



加载中
返回顶部
顶部