• 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' οnfοcus='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>


  • 相关阅读:
    PHP操作MYSQL数据库
    微信DLL劫持反弹shell复现
    ERROR Invalid options in vue.config.js: "baseUrl" is not allowed
    求曲线y=lnx在区间(2,6)内的一条切线,使得该切线与直线x=2,x=6及曲线y=lnx所围成的图形的面积最小。
    CentOS、Ubuntu、Debian三个linux比较异同
    jpa模糊查询(表中的某些数据)
    jpa查找数据库最新一条消息
    在@Data注释lombok上使用继承警告等于/ hashCode(Warning equals/hashCode on @Data annotation lombok with inheritance)
    git基本操作
    远程分支git换地址了,本地重新关联
  • 原文地址:https://www.cnblogs.com/inyu/p/13659090.html
Copyright © 2020-2023  润新知