什么是ztree二次加载数据
程序员文章站
2022-04-18 14:11:04
...
关于ztree二次加载数据。
js代码:
var groupSetting = { /* check : { enable : true//复选框 }, */ view: { showIcon: false,//是否显示节点的图标 showLine: true,//显示节点之间的连线。 expandSpeed: "slow",//节点展开、折叠时的动画速度 selectedMulti: true//不允许同时选中多个节点。 }, callback: { onClick: groupzTreeOnClick,//点击节点加载子节点 }, data : { simpleData : { enable : true, //使用简单数据模式 idKey : "id", //节点数据中保存唯一标识的属性名称 pIdKey : "pid", //节点数据中保存其父节点唯一标识的属性名称 rootPId : 0 //用于修正根节点父节点数据 默认值:null }, key: { name:"shopName", } } }; var groupTreeNodes; function loadOrgTree(){ $.ajax({ url : "getOrgTree.action", type : 'POST',//请求方式:post data: {shopId:1}, dataType : 'json',//数据传输格式:json async : false,//是否异步 cache : false,//是否使用缓存 error : function() { //请求失败处理函数 $.messager.alert("警告",'请求失败!'); }, success : function(data) { if(data!=null && data!=""){ groupTreeNodes = data;//把后台封装好的简单Json格式赋给treeNodes } } }); var group = $("#groupTree"); $.fn.zTree.init(group, groupSetting, groupTreeNodes); } function groupzTreeOnClick(event, treeId, treeNode) { var shopId=treeNode.id; //判断该节点下是否有节点,没有就加载节点 var treeObj = $.fn.zTree.getZTreeObj(treeId); var node = treeObj.getNodeByTId(treeNode.tId); if(node.children == null || node.children == "undefined"){ $.ajax({ url : "getOrglod.action", type : 'get',//请求方式:get data: {shopId:shopId}, dataType : 'json',//数据传输格式:json error : function() { //请求失败处理函数 $.messager.alert("警告",'亲,请求失败!'); }, success : function(data) { if(data!=null && data!=""){ //添加新节点 newNode = treeObj.addNodes(node, data); } } }); }; };
jsp代码:
<p data-options="region:'west',split:true" style="width:15%;"> <ul id="groupTree" class="ztree" ></ul> </p>
引用ztree插件:
<link href="<%=request.getContextPath()%>/js/zTree/zTreeStyle/zTreeStyle.css" rel="stylesheet"> <script src="<%=request.getContextPath()%>/js/zTree/jquery.ztree.core-3.5.js"></script> <script src="<%=request.getContextPath()%>/js/zTree/jquery.ztree.excheck-3.5.js"></script>
以上就是什么是ztree二次加载数据 的详细内容,更多请关注其它相关文章!
下一篇: jQuery实现模糊查询实战案例解析