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控件,添加插入修改和删除命令,可以自动删除修改更新数据,不需要编写一行代码,但是有时更新失败,原因在于选中了[开放式并发],这个选中,如果该表与其他的数据表关联 ...
随机推荐
- jQuery捕获
获得内容 - text().html() 以及 val() 三个简单实用的用于 DOM 操作的 jQuery 方法: text() - 设置或返回所选元素的文本内容 html() - 设置或返回所选元 ...
- python3练习100题——022
为了周末轻松点,多做一些题. 原题链接:http://www.runoob.com/python/python-exercise-example22.html 题目:两个乒乓球队进行比赛,各出三人.甲 ...
- python3练习100题——019
原题链接:http://www.runoob.com/python/python-exercise-example19.html 题目:一个数如果恰好等于它的因子之和,这个数就称为"完数&q ...
- codeforces 1288C. Two Arrays（dp）
链接:https://codeforces.com/contest/1288/problem/C C. Two Arrays 题意:给定一个数n和一个数m,让构建两个数组a和b满足条件,1.数组中所有 ...
- RemoteViews 整理
前言 RemoteViews表面意思就是远程的view,这个就很难理解了,远程的view.但是英语是抽象,remote本身就是偏僻的,偏远的意思. 所以remoteViews 就是地方view,天高皇 ...
- 初探selenium3原理
从一个启动浏览器并打开百度网页的代码开始 from selenium import webdriver driver = webdriver.chrome() driver.get('https:// ...
- unity命令行参数
Typically, Unity will be launched by double-clicking its icon from the desktop but it is also possib ...
- Federal Learning（联邦学习）认知
本人是学生党,同时也是小菜鸡一枚,撞运气有机会能够给老师当项目助理,在这个过程中肯定会学到一些有趣的知识,就在此平台上记录一下,在知识点方面有不对的还请各位指正. What(什么是联邦学习?) 联邦学 ...
- JS高级---一个神奇的原型链
一个神奇的原型链 <script> var divObj=document.getElementById("dv"); console.dir(divObj); //d ...
- java基础之 变量
变量是一个内存位置的名称. 1.成员变量(实例变量,属性) 成员变量就是类中的属性,当创建对象的时候,每个对象都有一份属性.一个对象中的属性就是成员变量. 2.本地变量(局部变量) 在方法内声明的变量 ...