ztree-编辑节点(树节点添加,删除,修改)
<!DOCTYPE html>
<HTML>
<HEAD>
<TITLE> ZTREE DEMO - addNodes / editName / removeNode / removeChildNodes</TITLE>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="../../../css/demo.css" type="text/css">
<link rel="stylesheet" href="../../../css/zTreeStyle/zTreeStyle.css" type="text/css">
<script type="text/javascript" src="../../../js/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="../../../js/jquery.ztree.core.js"></script>
<script type="text/javascript" src="../../../js/jquery.ztree.excheck.js"></script>
<script type="text/javascript" src="../../../js/jquery.ztree.exedit.js"></script>
<SCRIPT type="text/javascript">
var setting = {
view: {
selectedMulti: false
},
edit: {
enable: true,
showRemoveBtn: false,
showRenameBtn: false
},
data: {
keep: {
parent:true,
leaf:true
},
simpleData: {
enable: true
}
},
callback: {
beforeDrag: beforeDrag,
beforeRemove: beforeRemove,
beforeRename: beforeRename,
onRemove: onRemove
}
}; var zNodes =[
{ id:1, pId:0, name:"节点1", open:false},
{ id:11, pId:1, name:"节点1-1"},
{ id:12, pId:1, name:"节点1-2"},
{ id:121, pId:12, name:"节点1-2-1"},
{ id:122, pId:12, name:"节点1-2-2"},
{ id:123, pId:12, name:"节点1-2-3"},
{ id:3, pId:0, name:"节点3", open:false},
{ id:31, pId:3, name:"节点3-1"},
{ id:32, pId:3, name:"节点3-2"},
{ id:33, pId:3, name:"节点3-3"}
]; var log, className = "dark";
function beforeDrag(treeId, treeNodes) {
return false;
}
function beforeRemove(treeId, treeNode) {
className = (className === "dark" ? "":"dark");
showLog("[ "+getTime()+" beforeRemove ] " + treeNode.name);
console.log()
var children = treeNode.children;
if(children!=undefined && children.length>0){
alert("请先删除子节点");
return false;
}
return confirm("确认删除 节点 -- " + treeNode.name + " 吗?");
}
function onRemove(e, treeId, treeNode) {
showLog("[ "+getTime()+" onRemove ] " + treeNode.name);
}
function beforeRename(treeId, treeNode, newName) {
if (newName.length == 0) {
alert("节点名称不能为空.");
var zTree = $.fn.zTree.getZTreeObj("treeDemo");
setTimeout(function(){zTree.editName(treeNode)}, 10);
return false;
}
return true;
}
function showLog(str) {
if (!log) log = $("#log");
log.append("<li class='"+className+"'>"+str+"</li>");
if(log.children("li").length > 8) {
log.get(0).removeChild(log.children("li")[0]);
}
}
function getTime() {
var now= new Date(),
h=now.getHours(),
m=now.getMinutes(),
s=now.getSeconds(),
ms=now.getMilliseconds();
return (h+":"+m+":"+s+ " " +ms);
} var newCount = 1;
function add(e) {
var zTree = $.fn.zTree.getZTreeObj("treeDemo"),
isParent = e.data.isParent,
nodes = zTree.getSelectedNodes(),
treeNode = nodes[0];
if (treeNode) {alert(1)
treeNode = zTree.addNodes(treeNode, {id:(100 + newCount), pId:treeNode.id, isParent:isParent, name:"new node" + (newCount++)});
} else {alert(2)
treeNode = zTree.addNodes(null, {id:(100 + newCount), pId:0, isParent:isParent, name:"new node" + (newCount++)});
}
if (treeNode) {alert(3)
zTree.editName(treeNode[0]);
} else {alert(4)
alert("叶子节点被锁定,无法增加子节点");
}
}; function addParent(e) {
var zTree = $.fn.zTree.getZTreeObj("treeDemo"),
isParent = e.data.isParent,
nodes = zTree.getSelectedNodes(),
treeNode = nodes[0];
treeNode = zTree.addNodes(null, {id:(100 + newCount), pId:0, isParent:isParent, name:"new node" + (newCount++)});
zTree.editName(treeNode[0]);
};
function edit() {
var zTree = $.fn.zTree.getZTreeObj("treeDemo"),
nodes = zTree.getSelectedNodes(),
treeNode = nodes[0];
if (nodes.length == 0) {
alert("请先选择一个节点");
return;
}
zTree.editName(treeNode);
};
function remove(e) {
var zTree = $.fn.zTree.getZTreeObj("treeDemo"),
nodes = zTree.getSelectedNodes(),
treeNode = nodes[0];
if (nodes.length == 0) {
alert("请先选择一个节点");
return;
}
var callbackFlag = $("#callbackTrigger").attr("checked");
zTree.removeNode(treeNode, callbackFlag);
};
function clearChildren(e) {
var zTree = $.fn.zTree.getZTreeObj("treeDemo"),
nodes = zTree.getSelectedNodes(),
treeNode = nodes[0];
if (nodes.length == 0 || !nodes[0].isParent) {
alert("请先选择一个父节点");
return;
}
zTree.removeChildNodes(treeNode);
}; $(document).ready(function(){
$.fn.zTree.init($("#treeDemo"), setting, zNodes);
$("#addParent").bind("click", {isParent:true}, addParent);
$("#addLeaf").bind("click", {isParent:false}, add);
$("#edit").bind("click", edit);
$("#remove").bind("click", remove);
$("#clearChildren").bind("click", clearChildren);
});
</SCRIPT>
</HEAD>
<BODY>
<div class="content_wrap">
<div>
<input type="checkbox" id="callbackTrigger" checked /> removeNode 方法是否触发 callback<br/>
[ <a id="addParent" href="#" title="增加父节点" onclick="return false;">增加父节点</a> ]
[ <a id="addLeaf" href="#" title="增加叶子节点" onclick="return false;">增加叶子节点</a> ]
[ <a id="edit" href="#" title="编辑名称" onclick="return false;">编辑名称</a> ]<br/>
[ <a id="remove" href="#" title="删除节点" onclick="return false;">删除节点</a> ]
[ <a id="clearChildren" href="#" title="清空子节点" onclick="return false;">清空子节点</a> ]<br/>
</div>
<div class="zTreeDemoBackground left">
<ul id="treeDemo" class="ztree"></ul>
</div>
</div>
</BODY>
</HTML>

ztree-编辑节点(树节点添加,删除,修改)的更多相关文章
- Dom4j 操作, 节点查找 添加 删除 修改 。。。xPath
转: Dom4j 操作, 节点查找 添加 删除 修改 ...xPath 2013年11月28日 10:48:59 今晚打酱油8 阅读数:8506更多 个人分类: JavaWeb 版权声明:本文为博 ...
- JavaScript学习 - 基础(八) - DOM 节点 添加/删除/修改/属性值操作
html代码: <!--添加/删除/修改 --> <div id="a1"> <button id="a2" onclick=&q ...
- JTree 添加 , 删除, 修改
package com.swing.demo; import java.awt.BorderLayout; import java.awt.Container; import java.awt.eve ...
- SQL语句添加删除修改字段及一些表与字段的基本操作
用SQL语句添加删除修改字段 1.增加字段 alter table docdsp add dspcode char(200)2.删除字段 ALTER TABLE table_NA ...
- Entity framework 绑定到Datagridview的添加删除修改
Entity framework 绑定到Datagridview的添加删除修改 using System; using System.Collections.Generic; using System ...
- 用SQL语句添加删除修改字段、一些表与字段的基本操作、数据库备份等
用SQL语句添加删除修改字段 1.增加字段 alter table docdsp add dspcode char(200) 2.删除字段 ALTER TABLE table_NAME DROP CO ...
- SQL语句添加删除修改字段[sql server 2000/2005]
用SQL语句添加删除修改字段1.增加字段 alter table docdsp add dspcodechar(200)2.删除字段 ALTER TABLE table_NAME ...
- SQL语句添加删除修改字段
用SQL语句添加删除修改字段1.增加字段 alter table docdsp add dspcodechar(200)2.删除字段 ALTER TABLE table_NAME ...
- dir(dict)|字典的创建-添加-删除-修改-判断存在-取值等相关操作
dir(dict) ####字典操作:创建-添加-删除-修改-判断存在-取值 #(一)创建字典: {} .等号. zip(). [(),()] #1.创建空字典 dict0 = {} #2.等号创建 ...
- sqlserverdatasouce控件如何让添加删除修改自动化
对于sqlserverdatasouce控件,添加插入修改和删除命令,可以自动删除修改更新数据,不需要编写一行代码,但是有时更新失败,原因在于选中了[开放式并发],这个选中,如果该表与其他的数据表关联 ...
随机推荐
- 在sql server中如何检测一个字符串中是否包含另一个字符串
select CHARINDEX('456','123456') SQL语句使用CHARINDEX函数,来测试一个字符串中是否包含另一个字符串中的方法: 一.CHARINDEX函数介绍 1.函数功 ...
- [bzoj1905] [ZJOI2007] Hide 捉迷藏
题意简述 给定一棵 \(n\) 个点的树,起初每个点都为黑色. 2种操作,要么改变某个点的颜色(由黑至白或由白至黑),要么询问距离最远的两个黑点间的距离. 共 \(m\) 次操作. \(n\leq 1 ...
- .net 文件接口的封装,写日志,创建文件log
public class FileSupport { public static FileSupport Instance = new FileSupport(); public static str ...
- 安全相关的Linux知识
本文用于记录在安全中的Linux常用命令,基础命令可以移步去菜鸟教程(https://www.runoob.com/linux/linux-tutorial.html)学习 Linux重要的4个热键 ...
- codeblocks汉化
1.- 汉化包 腾讯微云 2.首先打开codeblocks安装文件夹,如:D:\CodeBlocks\share\CodeBlocks\locale\zh_CN,注意:zh_CN文件夹需自行创建 3. ...
- 第二篇,前端高性能JavaScript优化
加载和执行 JavaScript是单线程,所以JavaScript的加载和执行是从上下文加载执行完一个继续加载执行下一个文件会阻塞页面资源的加载,所以一般情况下JavaScript文件放在body标签 ...
- mybatis - @MapperScan
一. 测试代码 //实体类 public class User { private Integer id; private String name; private Integer age; priv ...
- JavaScript 开胃菜
注释 单行注释:// 快捷键: CTRL + / 多行注释: /* 内容 */ 快捷键: ctrl + shift + / 变量 申明变量 var name; 赋值 name = 'peach'; 初 ...
- dijkstra堆优化板子
咕咕咕. #include<queue> #include<cstdio> #include<cstring> #include<algorithm> ...
- VS“无法查找或打开PDB文件”是怎么回事?如何解决
有时候,我们使用 VS(Visual Studio)编译程序时会出现“无法查找或打开PDB文件”的提示,并且此时程序会生成失败,无法运行,如下图所示: 大家不要惊慌,出现这种提示并不是代码写错了,而是 ...