<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>树</title>
<link rel="stylesheet" href="$link.getContextURL()/manager/css/main.css" type="text/css" />
<link href="$link.getContextURL()/manager/css/zTreeStyle/zTreeStyle.css" rel="stylesheet" type="text/css" />
<link href="$link.getContextURL()/common/css/right.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="$link.getContextURL()/common/script/jquery-1.7.2.js"></script>
<script type="text/javascript" src="$link.getContextURL()/common/script/jquery.ztree-3.2.js"></script>
<script type="text/javascript" src="$link.getContextURL()/common/script/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="$link.getContextURL()/common/script/jquery.ztree.core-3.1.js"></script>
<script type="text/javascript" src="$link.getContextURL()/common/script/jquery.ztree.excheck-3.1.js"></script>
<script type="text/javascript" src="$link.getContextURL()/common/script/jquery.ztree.exedit-3.1.js"></script>
<script>
var setting = {
view: {
selectedMulti: false
},
async: {
enable: true,
url:"catalog1",
autoParam:["id"]
},
data: {
simpleData: {
enable: true,
idKey: "id",
pIdKey: "managerid"
}
} ,
view: {
expandSpeed: ""
},
callback: {
onAsyncSuccess: onAsyncSuccess,
onClick : onClick ,
onAsyncError: onAsyncError,
onRightClick: OnRightClick
}
  

};
<!-- 获取所有根节点的name,添加到一个数组中。每触发一次该函数就移除一个值-->
        
    var fag = false;var array = new Array();
function onClick(event, treeId, node) {

var treeObj = $.fn.zTree.getZTreeObj("tree")
var nodes = treeObj.getNodes();

if(fag == false){
  for(var m = 0 ; m < nodes.length;m++){
      array[m]=nodes[m].name;
  }
  fag = true;
}
 for(var h = 0 ; h < array.length; h++ ){ 

     if(array[h]==node.name){
       $.ajax({
    type: "GET",
    async: false,
    url: "$link.getContextURL()/managerTest/listChildNodes3?managerID="+node.id,
    data:"",
    success:function(data){
 zNodes=new Array(data.length);
                       for(var i=0;i<data.length;i++){
                           zNodes[i]={ id:data[i].memberid, pId:node.id, name:data[i].membername};
                       }
 var newNode = treeObj.addNodes(node, zNodes);
 var a= array.splice(h,1);
 window.top.$.XYTipsWindow.removeBox();
}
});
    }
 }
}


function OnRightClick(event, treeId, treeNode) {
if (!treeNode && event.target.tagName.toLowerCase() != "button" && $(event.target).parents("a").length == 0) {
zTree.cancelSelectedNode();
showRMenu("root", event.clientX, event.clientY);
} else if (treeNode && !treeNode.noR) {
zTree.selectNode(treeNode);
showRMenu("node", event.clientX, event.clientY);
}
}
function showRMenu(type, x, y) {
rMenu.css({"top":y+"px", "left":x+"px", "visibility":"visible"});
$("body").bind("mousedown", onBodyMouseDown);
}
function hideRMenu() {
if (rMenu) rMenu.css({"visibility": "hidden"});
$("body").unbind("mousedown", onBodyMouseDown);
}
function onBodyMouseDown(event){
if (!(event.target.id == "rMenu" || $(event.target).parents("#rMenu").length>0)) {
rMenu.css({"visibility" : "hidden"});
}
}
function onAsyncSuccess(event, treeId, treeNode, msg) { }
function onAsyncError(event, treeId, treeNode, XMLHttpRequest, textStatus, errorThrown) {
alert("异步获取数据出现异常。");
}

//添加组织
function addTreeNode() {
hideRMenu();
var node=zTree.getSelectedNodes()[0];
parent.document.getElementById("right").src="managerTest/addManager?managerId="+node.id+"&levels="+node.level+"&random="+Math.random();
}
//添加人员
function resetTree() {
hideRMenu();
var node=zTree.getSelectedNodes()[0];
 parent.document.getElementById("right").src="managerTest/addMember?managerId="+node.id+"&random="+Math.random();
}
//修改组织
function update() {
hideRMenu();
var node=zTree.getSelectedNodes()[0];
parent.document.getElementById("right").src="managerTest/updateManager?id="+node.id+"&random="+Math.random();
}
//删除组织
function remove() {
hideRMenu();
var node=zTree.getSelectedNodes()[0];
parent.jConfirm('您确认要删除"'+node.name+'"这个分类吗?', '确认对话框', function(result) {
if(result)
{
if(node.children==undefined || node.children.length==0)
{
$.get('deleteSystemOrganization', {
     id:node.id
   }, function(data, status) {
    //结果为success, error等等,但这里是成功时才能运行的函数
    if(data.result)
    {
     zTree.removeNode(node);
     parent.jAlert(data.message, '确认对话框');
    }
   });
}
else
{
   parent.jAlert('要删除的"'+node.name+'"分类有子节点,请先删除子节点', '确认对话框');
}
    }
});
}
//刷新树(1.重新加载,从头开始 2.刷新被选中的节点的根节点)
function refresh(){
      var treeObj = $.fn.zTree.getZTreeObj("tree");
              treeObj.reAsyncChildNodes(null, "refresh");
     }
     function refreshNode(node){
           
     }

   var zTree, rMenu;
$(document).ready(function(){
 $.fn.zTree.init($("#tree"), setting,null);
 zTree = $.fn.zTree.getZTreeObj("tree");
 rMenu = $("#rMenu");
 
 
});
/**
  * 接收一个json对象,将它添加到ztree中
  * @param {} data
  */
function leftFunction(data) {
//添加树节点方法
alert(data);
var treeObj = $.fn.zTree.getZTreeObj("tree");
var node=treeObj.getSelectedNodes()[0];
var newNode = data;
newNode = treeObj.addNodes(node, newNode);

window.top.$.XYTipsWindow.removeBox();
} $(function(){
$.ajax({
    type: "GET",
    url: "$link.getContextURL()/managerTest/listManager4",
    data:"",
    success:function(data){
 zNodes=new Array(data.length);
                       for(var i=0;i<data.length;i++){
                           zNodes[i]={ id:data[i].managerid, pId:0, name:data[i].managername};
                       }
 $.fn.zTree.init($("#tree"), setting, zNodes);

}
});
}); 
//-->
</script>
</head>
<body>
<div class="accordion" style="margin: 0px;">
<h1 class="caption on">
<a href="javascript:void(0);">组织管理</a>
</h1>
<div class="content on">
    <div id="managerList" >${managerList}
    </div>
<div><ul id="tree" class="ztree"></ul></div>
<div id="rMenu" style="position:absolute; visibility:hidden">
<ul>
<li id="m_add" onclick="resetTree();">增加人员</li>
<li id="m_add" onclick="addTreeNode();">增加组织</li>
<li id="m_update" onclick="update();">编辑组织</li>
<li id="m_remove" onclick="remove();">删除组织</li>
<li id="m_refresh" onclick="refresh();">重新加载树</li>
<li id="m_refreshNode" onclick="refreshNode();">刷新树选定的根节点</li>
</ul>
</div>
</div>
</div></body>
怎么也刷新不了树。使用ajax异步读取节点数据json,怎么刷新树呢?求大神帮帮忙ztree ajax json

解决方案 »

  1.   

    看看API吧 = = 应该有相关的方法
    http://www.ztree.me/v3/api.php
      

  2.   


    api里的方法是用setting={}进行设置url等等的,我设置之后,只能跳转到我需要进入的那个后台action,也可以返回json数据,但是怎么加载到ztree里呢?我在body里也显示了一下,可以实现的。怎么在js\jquery获取打到的呢?
      

  3.   

         var setting = {
    async: {
    enable: true,
                    url:"catalog1",
                    autoParam:["id"]
    dataFilter: filter
    },
    ..................
    function filter(treeId, parentNode, childNodes) {
    $.each(childNodes,function(i,v){ });
    return childNodes;
    }
    //好好了解一下dataFilter