求指导！ 前端如何解决，求指导，如果处理数据源怎么保持嵌套之前的依赖关系。
<script type="text/javascript" src="zTreejs/jquery.ztree.core.js"></script>
<script type="text/javascript" src="zTreejs/jquery.ztree.excheck.js"></script>
<script type="text/javascript" src="zTreejs/jquery.ztree.exedit.js"></script>
<SCRIPT type="text/javascript">
var zNodes;
var setting = {
view: {
addHoverDom: addHoverDom,
removeHoverDom: removeHoverDom,
selectedMulti: true
},
check: {
enable: true
},
data: {
simpleData: {
enable: true
}
},
edit: {
enable: true
},
callback: {
onExpand : zTreeBeforeClick,//点击节点加载子节点
beforeRemove: beforeRemove,//用于捕获节点被删除之前的事件回调函数，并且根据返回值确定是否允许删除操作
beforeRename: beforeRename,//用于捕获节点编辑名称结束（Input 失去焦点 或 按下 Enter 键）之后，更新节点名称数据之前的事件回调函数，并且根据返回值确定是否允许更改名称的操作
beforeDrop : beforeDrop,
onDrop : onDrop
}
};
function loadPower(){
$.ajax({
type:"post",
url:"${pageContext.request.contextPath}/itemcat/findTree",
async:false,
dataType:"json",
success:function(data){
zNodes=data;
}
})
}
$(document).ready(function(){
loadPower();
/* $.fn.zTree.init($("#treeDemo"), setting, zNodes); */
$.fn.zTree.init($("#treeDemo"), setting, zNodes);
});
/* ztree一级一级加载数据 */
function zTreeBeforeClick(event, treeId, treeNode) {
var id=treeNode.id;
//判断该节点下是否有节点，没有就加载节点
var treeObj = $.fn.zTree.getZTreeObj(treeId);
var node = treeObj.getNodeByTId(treeNode.tId);
if(node.children == null || node.children == "undefined"){
$.ajax({
url : "${pageContext.request.contextPath}/itemcat/findTree",
type:'get',//请求方式：get
data: {id:id},
dataType : 'json',//数据传输格式：json
error : function() {
$.messager.alert("警告",'亲，请求失败！');
},
success : function(data) {
if(data!=null && data!=""){
newNode = treeObj.addNodes(node, data);
}
}
});
};
};
//添加
var newCount = 1;
function addHoverDom(treeId, treeNode) {
var sObj = $("#" + treeNode.tId + "_span");
if (treeNode.editNameFlag || $("#addBtn_"+treeNode.tId).length>0) return;
var addStr = "<span class='button add' id='addBtn_" + treeNode.tId
+ "' title='add node' onfocus='this.blur();'></span>";
sObj.after(addStr);
var btn = $("#addBtn_"+treeNode.tId);
if (btn) btn.bind("click", function(){
$.ajax({
type : "POST",
async : false,
url : "${pageContext.request.contextPath}/itemcat/addRootTree",
data :
{
name : "类目" + newCount,
parentId: treeNode.id,
sortOrder:treeNode.level+1
},
success:function(result){
if(""!=result ){
var zTree = $.fn.zTree.getZTreeObj("treeDemo");
zTree.addNodes(treeNode, {id:result.data.id, pid:treeNode.id, name:"类目" + (newCount)});
return false;
}else{
alert("无法添加新类目，请联系管理员！");
}
}
});
return false;
});
};
function removeHoverDom(treeId, treeNode) {
$("#addBtn_"+treeNode.tId).unbind().remove();
};
var log, className = "dark";
//ok 删除
function beforeRemove(treeId, treeNode) {
className = (className === "dark" ? "":"dark");
var zTree = $.fn.zTree.getZTreeObj("treeDemo");
zTree.selectNode(treeNode);
var isDel=confirm("确认删除类目 -- " + treeNode.name + " 吗？");
var isDeled=false;
if (isDel) {
$.ajax({
type : "POST",
async : false,
url : "${pageContext.request.contextPath}/itemcat/deleteItemCat",
data :
{
id : treeNode.id
},
success:function(result){
if (result.status==200) {
isDeled= true;
} else {
alert("数据删除失败,请联系管理员!");
isDeled= false;
}
}
});
return isDeled;
}else{
return false;
}
}
//ok 重命名
function beforeRename(treeId, treeNode, newName, isCancel) {
className = (className === "dark" ? "":"dark");
if (newName.length == 0) {
alert("节点名称不能为空!");
var zTree = $.fn.zTree.getZTreeObj("treeDemo");
setTimeout(function(){zTree.editName(treeNode)}, 10);
return false;
}else{
var isDeled=false;
$.ajax({
type : "POST",
async : false,
url : "${pageContext.request.contextPath}/itemcat/editTreeName",
data :
{
id : treeNode.id,
name : newName
},
success:function(result){
if (result.status == 200) {
isDeled= true;
} else {
alert("重命名失败!请联系管理员");
isDeled= false;
}
}
});
return isDeled;
}
}
/*设置一个根节点*/
/* beforeDrop方法：在添加到目标节点下之前，判断目标节点是否存在（这里限制了对于根节点的添加），若存在则判断目标节点下是否已存在相同的节点*/
function beforeDrop(treeId, treeNodes, targetNode, moveType, isCopy) {
//如果有提交到后台的操作，则会先执行if…else…再执行post等提交操作
alert(treeNodes[0].id);
alert(treeNodes[0].level);
alert(targetNode.id);
alert(targetNode.level);
if(targetNode) {
if(targetNode.id == 1){
alert("Error: This name already exists.");
return false;
}
if(targetNode.children != undefined){
//console.log(targetNode.children[0].name)
//var nodes = targetNode.children;
var name = treeNodes[0].name;
for (i = 0; i < targetNode.children.length; i++) {
if(targetNode.children[i].name == name){
alert("Error: This name already exists.");
return false;
}
}
}
return true;
}
return false;
}
//拖拽
function onDrop(event, treeId, treeNodes, targetNode, moveType, isCopy) {
className = (className === "dark" ? "":"dark");
//拖拽成功时，修改被拖拽节点的pid
if(treeNodes && targetNode){
alert(treeNodes[0].id);
alert(targetNode.id);
var isDeled=false;
$.ajax({
type : "POST",
async : false,
url : "${pageContext.request.contextPath}/itemcat/editTree",
data :
{
id : treeNodes[0].id,
pid: targetNode.id ,
sortOrder: targetNode.level
},
success:function(result){
if (result.status == 200) {
isDeled= true;
} else {
alert("操作失败!");
isDeled= false;
}
}
});
return isDeled;
}
}
//-->
/* 添加根节点*/
// 添加根目录。界面上添加一个button，点击时执行。（因为，树上直接进行添加操作，添加的是子部门）
function addRoleTree(){
$.ajax({
type : "POST",
async : false,
url : "${pageContext.request.contextPath}/itemcat/addRootTree",
data :
{
name : "类目一",
parentId : 0 ,
sortOrder:1
},
success:function(result){
window.location.reload();
}
});
}
</SCRIPT>