• ztree addNode editName removeNode


    1.ztree api中完全拥有以上操作的相关解释,及简单Demo。

    2.主要是要学会将单独的效果组合起来使用。

       2.1  如: 添加完新的Node节点之后,怎么立即进入新节点的编辑状态来修改名称(或者在添加新节点之前怎么输入节点名称)。

       var zTree = $.fn.zTree.getZTreeObj("departmentTree");

       //创建新节点,并保存新节点的引用
       var new_node = zTree.addNodes(treeNode, {id:(100 + newCount), pId:treeNode.id, name:"new node" + (newCount++)});

       //进入编辑名称的状态
       zTree.editName(new_node[0]);

        2.2 如: 怎么在删除节点时,先提示是否确认。

       原来函数,绑定在setting.callback.beforeRemove

      function beforeRemove(treeId, treeNode) {
                className = (className === "dark" ? "":"dark");
                showLog("[ "+getTime()+" beforeRemove ]     " + treeNode.name);
                var zTree = $.fn.zTree.getZTreeObj("departmentTree");
                zTree.selectNode(treeNode);
                return confirm("删除节点 -- " + treeNode.name + " 吗?");
            }

       改变,插入模态框。

       function beforeRemove(treeId, treeNode) {
                className = (className === "dark" ? "":"dark");
                showLog("[ "+getTime()+" beforeRemove ]     " + treeNode.name);
                sureDeleteDeptSetModal(treeNode);
                return false;
            }
        function sureDeleteDeptSetModal(treeNode){
                $("#department_settings_delete_modal").modal();
                $("#department_settings_delete_sure").click(function(){
                    var zTree = $.fn.zTree.getZTreeObj("departmentTree");
                    zTree.removeNode(treeNode);    
                });
                $("#department_settings_delete_cancel").click(function(){
                    return false;
                });
            }

       模态框:

       <!-- START modal-->
       <div id="department_settings_delete_modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" class="modal">
          <div class="modal-dialog" style="800px;">
             <div class="modal-content">
                <div class="modal-header">
                   <button type="button" data-dismiss="modal" aria-hidden="true" class="close">×</button>
                   <h4 id="myModalLabel" class="modal-title">确认删除该部门吗? </h4>
                </div>
                <div class="modal-body">
                </div>
                <div class="modal-footer">
                    <button type="button" id="department_settings_delete_sure" data-dismiss="modal"  class="btn btn-default">确定</button>
                   <button type="button" id="department_settings_delete_cancel" data-dismiss="modal" class="btn btn-default">取消</button>
                </div>
             </div>
          </div>
       </div>
       <!-- end modal -->

  • 相关阅读:
    144环形链表
    83. 删除排序链表中的重复元素
    21合并两个有序链表
    PyCharm2020激活破解教程
    Python正课目录
    2条pip命令解决Python项目依赖的导出和导出
    pip离线安装模块
    Python正课149 —— luffy项目 User表的配置
    Python正课148 —— luffy项目 数据库配置
    解决:django中LookupError No installed app with label 'admin'
  • 原文地址:https://www.cnblogs.com/rocky-fang/p/5258392.html
Copyright © 2020-2023  润新知