/***********************前端css********************************/
<style>
.ztree *{
font-family:"微软雅黑";
font-size:14px;
}
.ztree li span.button.pIcon_ico_open{margin-right:2px; background: url('<%=basePath%>resources/app/images/pIcon.png') no-repeat scroll 0 0 transparent; vertical-align:top; *vertical-align:middle}
.ztree li span.button.pIcon_ico_close{margin-right:2px; background: url('<%=basePath%>resources/app/images/pIcon.png') no-repeat scroll 0 0 transparent; vertical-align:top; *vertical-align:middle}
.ztree li span.button.subIcon_ico_open, .ztree li span.button.subIcon_ico_close{margin-right:2px; background: url('<%=basePath%>resources/app/images/subIcon.png') no-repeat scroll 0 0 transparent; vertical-align:top; *vertical-align:middle}
.ztree li span.button.pIcon_ico_docu{margin-right:2px; background: url('<%=basePath%>resources/app/images/pIcon.png') no-repeat scroll 0 0 transparent; vertical-align:top; *vertical-align:middle}
.ztree li span.button.subIcon_ico_docu{margin-right:2px; background: url('<%=basePath%>resources/app/images/subIcon.png') no-repeat scroll 0 0 transparent; vertical-align:top; *vertical-align:middle}
</style>
/********************************前端js**********************/
var setting;
var selectedTreeId="";
var treeObj;
$(document).ready(function(){
var url="<%=basePath %>v/uc/user/getJsonSort";
$.getJSON(url, function (zNodes){
zNodes = "["+zNodes+"]";
treeObj = $.fn.zTree.init($("#treeDemo"), setting, eval('('+zNodes+')'));
});
var ajaxUrl = "";
setting= {
async: {
enable: true,
url:function(){
return ajaxUrl;
}
},
view: {
showIcon: showIconForTree
},
data: {
simpleData: {
enable: true
}
},
callback: {
onClick:loadList,
beforeExpand: function(treeId, treeNode) {
ajaxUrl = "<%=basePath %>v/uc/user/getSubJsonSort?code="+treeNode.id;
}
}
};
function showIconForTree(treeId, treeNode) {
return treeNode.level != 2;
};
function loadList(event, treeId, treeNode,clickFlag) {
selectedTreeId = treeNode.id;
$("#list").setGridParam({
postData:{orgn:treeNode.id}
}).trigger("reloadGrid");
};
});
/*************************************后台拼接json***********/
@RequestMapping("getJsonSort")
@ResponseBody
public String getJsonSort(String code){
/*String basePath = SystemPropertyGetUtil.getResource("config").getString("system.url.base");
String pIconPath=basePath+"resources/app/images/subIcon.png";*/
StringBuilder sb = new StringBuilder();
List<SMTableZZJG> topList = orgnService.getTopOrgn();
for(int i=0;i<topList.size();i++){
SMTableZZJG top = topList.get(i);
sb.append("{");
sb.append("id:'"+top.getField000()+"'");
sb.append(",pId:'"+top.getField003()+"'");
sb.append(",name:'"+top.getField001()+"'");
List<SMTableZZJG> subList = orgnService.getSubOrgn(top.getField000());
sb.append(",iconSkin:'pIcon'");
if(subList.size()>0)
{//如果有子集,则保证打开,方便前端expand使用
sb.append(",isParent:true");
}
else
{
sb.append(",isParent:false");
}
sb.append("},");
}
String str = sb.toString().substring(0, sb.toString().length()-1);
return str;
}
相关推荐
ZTree的一个显著特性是支持异步加载,这意味着它可以在用户需要时按需加载子节点,减少了初次加载时的数据量,提高了页面响应速度。本文将详细讲解如何使用Java来实现ZTree的异步加载功能。 首先,我们需要理解...
【Ztree无限极树】是一种基于JavaScript的可扩展的树形菜单组件,广泛应用于Web开发中,用于构建具有层级结构的界面元素。它以其高效、灵活和强大的功能著称,支持无限级节点展开,适用于展示复杂的组织结构或者分类...
最近项目中有一个比较大型的树节点加载,网上面也看过一些解决方案,感觉都不是很好,也有很多误区,比如单击节点时加载子...ztree fileter方法是在每次展开时都会执行,所以根据不同的请求达到异步加载子节点的需求。
zTree 是一个依靠 jQuery 实现的多功能 “树插件”。优异的性能、灵活的配置、多种功能的组合是 zTree 最大优点。 介绍 zTree 是一个依靠 jQuery 实现的多功能 “树插件”。优异的性能、灵活的配置、多种功能的组合...
### jQuery ZTree异步加载详解 #### 一、概述 jQuery ZTree插件是一款功能强大的树形控件,被广泛应用于Web开发中,用于展示层级结构数据。在大数据量的场景下,同步加载所有节点数据可能会导致页面加载缓慢,用户...
本篇我们将深入探讨“异步&同步加载树节点”这一主题,以zTree为例,解析其实现机制和优势。 首先,我们要理解什么是同步和异步加载。同步加载是指浏览器在执行代码时,如果遇到一个耗时的操作(如加载大量数据),...
【标题】"ztree异步加载demo(有说明文档)" 涉及到的知识点主要围绕着ZTree,这是一个非常流行的JavaScript组件,主要用于构建树形结构的界面,尤其适用于网站导航、文件目录管理和组织结构展示等场景。异步加载是...
zTree支持JSON数据格式,可以静态加载或通过Ajax异步加载节点数据,这为动态更新和实时数据同步提供了可能。它还允许自定义皮肤和图标,通过CSS实现视觉风格的多样化。zTree的另一大亮点是其灵活的checkbox和radio...
ZTree的异步加载机制是其核心功能之一,它的主要思想是按需加载,即在用户滚动、展开节点或进行其他操作时,只加载当前需要显示的子节点,而不是一次性加载所有数据。这种方式极大地提高了页面的加载速度,减少了...
**jQuery ZTree 异步动态加载详解** 在Web开发中,数据展示往往涉及到大量信息的处理,特别是树形结构的数据。jQuery ZTree是一款强大的JavaScript组件,用于构建具有丰富交互效果的树状菜单或树形控件。在面对大...
【zTree异步加载Demo】是一个基于SpringMVC框架和MySQL数据库实现的示例,它展示了如何使用zTree这一流行的JavaScript树形插件进行异步数据加载。zTree是一款功能强大的jQuery插件,广泛用于构建多级目录结构,如...
这个"zTree异步加载简单示例VS2008项目完整源码"是针对开发人员的一个实用资源,提供了如何在Visual Studio 2008环境下实现zTree异步加载功能的具体代码实例。 异步加载(Async Loading)是zTree的核心特性之一,它...
zTree是一款基于JavaScript的开源树形插件,它能够帮助开发者轻松实现动态加载、多选、异步数据加载等功能。本文将深入探讨如何使用zTree来动态加载树形菜单,同时也会提及一些相关的核心知识点。 首先,zTree的...
一个Ztree异步分批加载demo,只有前台代码,后台只需要提供分页查询,然后页码自动增长即可。
在你提到的场景中,"使用ztree异步加载全国地区"是一种优化用户体验的有效方法。zTree是一款非常流行的jQuery插件,主要用于实现树形结构的展示和操作,尤其适用于处理大量数据的场合。 首先,我们来详细了解一下...
ztree的异步加载实现jfinal,希望可以帮到你
**ZTree 异步加载树结构详解** ZTree 是一款基于 jQuery 的强大的树形插件,广泛应用于构建具有层级关系的列表。在处理大量数据时,为了提高用户体验,避免一次性加载所有节点导致页面卡顿,我们可以采用异步加载...