很久没搞过树形控件了，再次接触看官网文档有点没懂，于是在网上找了个代码copy上，但数据是写死的，就想这在用ajax异步取出数据替换，下面是js代码

//定义全局ztree数据

varzNodes;/*初始化ztree数据*/

functioninitZtree(){

$.ajax({

type:"GET",

url:"/articleType/getArticleType",

dataType:"json",

async:false,

success:function(data){varstr="";for(vari=0;i

str+= "{id:'"+data.type[i].id+"', pId:'"+data.type[i].pid+"', name:'"+data.type[i].name+"'},\n";

}

alert("["+str+"]");

zNodes='['+str+']';

$("#ztree").val(zNodes);

}

});

}

$(function(){//initZtree();

alert($("#ztree").val()+"999");

alert(zNodes);

zNodess=zNodes;

alert("8888"+zNodess);

})varzTreeObj,

setting={

view: {

selectedMulti:false},

async: {

enable:true,

url:"/articleType/getArticleType",

otherParam: {"id":"1","name":"test"}

data: {

simpleData: {

enable:true,

idKey:"id",

pIdKey:"pId",

rootPId:""}

callback: {

onClick:function(treeId, treeNode) {vartreeObj=$.fn.zTree.getZTreeObj(treeNode);varselectedNode=treeObj.getSelectedNodes()[0];

$("#txtId").val(selectedNode.id);

$("#txtAddress").val(selectedNode.name);

}

$(document).ready(function(){

zTreeObj=$.fn.zTree.init($("#tree"), setting,zNodess );

});

View Code

代码捏有点乱，大概就是想用ajax取出数据，但遇到个问题，取出来的数据拼接成json 不能被识别。

于是又继续看官网demo 和api

找到个基础的动态取数据

ZTREE DEMO - Async

异步加载节点数据的树

[ 文件路径: core/async.html ]

ztree 更新配置后重新渲染树_zTree 树形控件 ajax动态加载数据相关推荐

ztree 更新配置后重新渲染树_【问】zTree异步加载时添加父节点怎样避免再次加载整树...
该楼层疑似违规已被系统折叠隐藏此楼查看此楼具体情况是每当我执行add方法添加父节点的时候,都回去server端重新获取一次树节点信息,并加载在新增加的节点下. 页面代码如下 var settin ...
树的懒加载怎么用ajax调接口,ElementUI tree树形控件的懒加载使用
先看效果: image 1.界面中: :data="treeData" :props="defaultProps" :load="loadNode&q ...
treeview控件怎么使用修改发育树_树形控件在生产力工具中的设计
惊!半年实践血泪史,3000 字深度好文,一个爱树的设计师手把手教你如何设计「树」! 树形控件是种常见的设计模式,几乎与图形化用户界面同时诞生,通过结构化的组织方式逐级展示内容,让整体信息架构一目了 ...
cascader 动态加载回显_Elementui cascader 级联选择器动态加载数据，保存后回显的问题...
问题描述使用elementui,进行地区选择,分省市区三级动态加载,首次保存后,再次回看数据,怎么选中上次保存的地区省市区三级都是动态加载,下次回来,只有省一级数据,model里面存的是一个数组, ...
swiper动态加载数据滑动失效,ajax执行后swiper.js的效果消失问题
使用swiper.js做一些动效时,如果进行了ajax,并且重新把DOM写入到HTML代码中,会导致swiper.js的特效消失的问题.原因是ajax加载后,原先new 的Swiper对象,不认识新来 ...
树状下拉combotree的动态加载
用的是easyui的combotree插件先贴效果当返回的节点的state为open时说明他是有下级数据的,否则就是节点数据, 每次点击上级的时候,上级节点展开之前,他会根据上级的id取请求他的下 ...
layui删除后刷新表格_layui form表单提交之后重新加载数据表格的方法
如下图,在我们做高级查询的时候需要重新加载数据表格table.reload(); HTML form表单菜单:  JS $(function () { //注意:这里是数据表格的加载数据,必须写 ...
jQuery写的一棵动态加载的树
一个棵自己写的jQuery的树.与大家分享一下. 主要用于动态加载子节点,避免大数据量加载页面慢的情况. 展示效果: 下面贴上源码: css部分: #TreeView { width:100% ...
SpringMVC--Ajax异步加载数据$(function (){ 逻辑代码}) 的意思是让dom结构加载完毕后再去执行逻辑代码
1. SpringMVC–Ajax异步加载数据 1.1 实体类user User.java package com.tian.pojo;import lombok.AllArgsConstructor ...
jQuery树形控件zTree使用小结
0 zTree简介树形控件的使用是应用开发过程中必不可少的.zTree 是一个依靠 jQuery 实现的多功能 "树插件".优异的性能.灵活的配置.多种功能的组合是 zTree ...

ztree 更新配置后重新渲染树_zTree 树形控件 ajax动态加载数据

异步加载节点数据的树

[ 文件路径: core/async.html ]

ztree 更新配置后重新渲染树_zTree 树形控件 ajax动态加载数据相关推荐

最新文章

热门文章