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="width: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 -->
ztree addNode editName removeNode的更多相关文章
- javascript入门 之 zTree(十四 增删查改)(二)
<!DOCTYPE html> <HTML> <HEAD> <TITLE> ZTREE DEMO - addNodes / editName / rem ...
- ztree-可拖拽可编辑的树
<!DOCTYPE html> <HTML> <HEAD> <TITLE> ZTREE DEMO - addNodes / editName / rem ...
- ztree-编辑节点(树节点添加,删除,修改)
<!DOCTYPE html> <HTML> <HEAD> <TITLE> ZTREE DEMO - addNodes / editName / rem ...
- js-DOM控制HTML
一. dom对象控制html HTML DOM 是 W3C 标准(是 HTML 文档对象模型的英文缩写,Document Object Model for HTML). HTML DOM ...
- (Qt 翻译) QGLSceneNode
#include <QGLSceneNode> QGLSceneNode ( QObject * parent = 0 ) QGLSceneNode ( const QGeometryDa ...
- JAVAscript学习笔记 jsDOM 第五节 (原创) 参考js使用表
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 第二章 JavaScript总结(下)
js参考表 变量的引用 <script> var n=10; m = 10; //全局变量 function a () { var x = 10; //局部变量 b = 10;//全局变量 ...
- 第二章 JavaScript案例(中)
1. js事件 HTML代码 <!DOCTYPE html> <html lang="en" onUnload="ud()"> < ...
- JS DOM对象控制HTML元素详解
JS DOM对象控制HTML元素详解 方法: getElementsByName() 获取name getElementsByTagName() 获取元素 getAttribute() 获取元素 ...
随机推荐
- IT战略规划咨询
目录 1IT战略规划微咨询简介 2IT战略的意义 3服务模式 4IT战略规划焦点问题 5IT战略规划步骤 6服务提供方微咨询网 7微咨询价值 8微咨询服务方式 9IT工作规划与IT战略规... IT战 ...
- saiku 分布式实践
saiku比较吃内存,一旦人多了,那么内存可能不够,所以会考虑主从结构,分担压力.为了保证数据的稳定性,也会有类似的考虑,那么问题来了,如何实现saiku的分布式搭建哪? 我阅读了一些国内的文章,没有 ...
- 最近想上游戏,弄了个工作室,名"柑谷工作室"
最近想上游戏,弄了个工作室,名"柑谷工作室",名字取得有点随便,原因是好名字都让狗用了.想当年我用的龙纹工作室,现在龙纹两字也被人用了.人家有硅谷,然后我弄个柑谷,差不多吧.算了, ...
- Linux 技巧:让进程在后台可靠运行的几种方法(转)
下面举了一些例子, 您可以针对不同的场景选择不同的方式来处理这个问题. nohup/setsid/& 场景: 如果只是临时有一个命令需要长时间运行,什么方法能最简便的保证它在后台稳定运行呢? ...
- Log4net介绍
一.Log4net介绍 log4net是一个功能著名的开源日志记录组件.利用log4net可以方便地将日志信息记录到文件.控制台.Windows事件日志和数据库(包括MS Server,Access, ...
- .NET面试必备(整理)
1.简述 private. protected. public. internal 修饰符的访问权限. private : 私有成员, 在类的内部才可以访问.public : 公共成员,完全公开,没有 ...
- 审核流(3)低调奢华,简单不凡,实例演示-SNF.WorkFlow--SNF快速开发平台3.1
下面我们就从什么都没有,结合审核流进行演示实例.从无到有如何快速完美的实现,然而如此简单.低调而奢华,简单而不凡. 从只有数据表通过SNF.CodeGenerator代码生成器快速生成单据并与审核流进 ...
- 《Programming with Objective-C》第三章 Working with Objects
Object和普通变量的区别 If you’re used to using terms like the stack and the heap, a local variable is alloca ...
- JS思维之路菜鸟也能有大能量(1)--模拟push
因为本系列文章属于思维类,所以不做基础方法的讲解. 任务:首先我定义了一个变量var arr = [0,1,2,3,4,5];我现在想模拟push方法在这个数组的5后面加东西,我们应该怎么做?给你5分 ...
- 剑指架构师系列-tomcat6通过伪异步实现connector
首先在StandardService中start接收请求的线程,如下: synchronized (connectors) { for (int i = 0; i < connectors.le ...