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 -->