很久没搞过树形控件了 , 再次接触看官网文档有点没懂,于是在网上找了个代码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