100字范文,内容丰富有趣,生活中的好帮手!
100字范文 > ztree 更新配置后重新渲染树_zTree 树形控件 ajax动态加载数据

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

时间:2019-10-04 15:30:37

相关推荐

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

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

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。