一、应用场景
在实际应用中会遇到动态操作树各节点的需求,在增加树节点后如何实时动态刷新树就十分有必要了。
二、项目实践
比如要在test1234节点下新建子节点,首先要选中test1234节点,添加成功后,根据test1234结点的TID去后台请求对应子节点数据,实现动态刷新。删除节点类似。
三、代码实现
1、初始化时必须设置配置
3、涉及的方法详解
参数说明
obj JQuery Object 用于展现zTree的DOM容器
zSetting JSON zTree的配置数据,具体请参考 “setting 配置详解”中的各个属性详细说明
zNodes Array(JSON)/JSON zTree的节点数据,具体请参考 “treeNode 节点数据详解”中的各个属性详细说明
返回值
zTree对象,提供操作zTree的各种方法,对于通过js操作zTree来说必须通过此对象
如果不需要自行设定全局变量保存,可以利用
2、zTreeObj.getSelectedNodes 获取 zTree 当前被选中的节点数据集合
返回值
返回值 Array(JSON) 当前被选中的节点数据集合
方法实例:
1. 获取当前被选中的节点数据集合
var treeObj = $.fn.zTree.getZTreeObj("tree");
var nodes = treeObj.getSelectedNodes();
3、zTreeObj.getNodeByTId 根据 zTree 的唯一标识 tId 快速获取节点 JSON 数据对象
参数:tId String 节点在 zTree 内的唯一标识 tId
返回值:返回值 JSON tId 对应的节点 JSON 数据对象 如无结果,返回 null
方法实例:
1. 获取 tId = "tree_10" 的节点数据
var treeObj = $.fn.zTree.getZTreeObj("tree");
var node = treeObj.getNodeByTId("tree_10");
4、zTreeObj.selectNode 选中指定节点
参数:treeNode JSON 需要被选中的节点数据
addFlag Boolean
addFlag = true 表示追加选中,会出现多点同时被选中的情况
addFlag = false 表示单独选中,原先被选中的节点会被取消选中状态
setting.view.selectedMulti = false 时,此参数无效,始终进行单独选中
5、zTreeObj.reAsyncChildNodes 强行异步加载父节点的子节点。[setting.async.enable = true 时有效]
参数:parentNode JSON 指定需要异步加载的父节点 JSON 数据,
reloadType String reloadType = "refresh" 表示清空后重新加载。reloadType != "refresh" 时,表示追加子节点处理
isSilent Boolean 设定异步加载后是否自动展开父节点。isSilent = true 时,不展开父节点,其他值或缺省状态都自动展开。
方法实例
1. 重新异步加载当前选中的第一个节点
var treeObj = $.fn.zTree.getZTreeObj("tree");
var nodes = treeObj.getSelectedNodes();
if (nodes.length>0) {
treeObj.reAsyncChildNodes(nodes[0], "refresh");
}
2、