Ztree树节点应用

树节点增删改查:

前台jsp页面：

<%
    String root=request.getContextPath();//获取项目目录
%>

<SCRIPT type="text/javascript">
    var setting = {
        async: {
            enable: true,
            url:"<%=root%>/book/cat/list.do",
            autoParam:["id", "name=n", "level=lv"],
            otherParam:{"otherParam":"zTreeAsyncTest"}
        },
        view: {
            addHoverDom: addHoverDom,
            removeHoverDom: removeHoverDom,
            selectedMulti: false
        },
        check: {
            enable: true
        },
        data: {
            simpleData: {
                enable: true
            }
        },
        edit: {
            enable: true,
        },
        callback: {
            onRemove: onRemove, //移除事件
            onRename: onRename //修改事件
        }
    };

    $(document).ready(function(){
        $.fn.zTree.init($("#treeDemo"), setting);
    });

    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);
        var name = "new Node";
        if (btn) btn.bind("click", function(){
            var zTree = $.fn.zTree.getZTreeObj("treeDemo");
            $.post('<%=root%>/book/cat/add.do?pId='+treeNode.id+'&nodeName='+name,function (data) {
                var newID = data; //获取新添加的节点Id
                zTree.addNodes(treeNode, {id:newID, pId:treeNode.id, name:name}); //页面上添加节点
                var node = zTree.getNodeByParam("id", newID, null); //根据新的id找到新添加的节点
                zTree.selectNode(node); //让新添加的节点处于选中状态
            });
        });
    };
    function onRemove(e, treeId, treeNode) {
       var onRe =  confirm("确认删除 节点 -- " + treeNode.name + " 吗？");
        //需要对删除做判定或者其它操作，在这里写~~
        if (onRe){
        $.post('<%=root%>/book/cat/del.do?nodeId='+treeNode.id);
        console.log(treeNode.id);
        }
    }
    function onRename(e, id, treeNode, isCancel) {
        //需要对名字做判定的，可以来这里写~~
        if (treeNode.name.length == 0) {
            alert("节点名称不能为空.");
            return false;
        }
        console.log(treeNode.id);
        $.post('<%=root%>/book/cat/edit.do?nodeId='+treeNode.id+'&nodeName='+treeNode.name);
    }
    function removeHoverDom(treeId, treeNode) {
        $("#addBtn_"+treeNode.tId).unbind().remove();
    };
</SCRIPT>