<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="<%=webpath%>/js/zTree/css/zTreeStyle/zTreeStyle.css" type="text/css">
<script type="text/javascript" src="<%=webpath%>/js/zTree/js/jquery.ztree.core-3.5.js"></script>
</head>
<body>
<script type="text/javascript">
var zTree;
var demoIframe;
var selectNode;
var setting = {
view: {
dblClickExpand: false,//是否双击展开
showLine: true,
selectedMulti: false,
expandSpeed: "slow",//节点展开动画速度
},
async:{
autoParam:["id"],//点击节点进行异步加载时默认发送参数
dataType:"json",
enable:true,//是否异步加载
type:"post",
url:"<%=request.getContextPath()%>/login/unit/getzTreeOrgUnitData.do"
},
check: {
enable: true//是否设置复选框
},
data: {
key:{
name:"name"
},
simpleData : {
enable : true,
idKey : "id", // id编号命名
pIdKey : "orgAccountId", // 父id编号命名
rootPId : 0//根节点
}
},
callback: {
onClick:function(event, treeId, treeNode, msg){//点击节点时执行
selectNode = treeNode;
var treeObj = $.fn.zTree.getZTreeObj(treeId);
if (treeNode.isParent) {
treeObj.expandNode(treeNode);//展开所选择的节点
$("#testIframe").attr('src','<%=request.getContextPath()%>/login/unit/orgUnitListPage.do?orgAccountId='+treeNode.id);
} else {
$("#testIframe").attr('src','');
}
},
onAsyncSuccess:function(){//异步加载完成后执行
var treeObj = $.fn.zTree.getZTreeObj("tree");
treeObj.expandAll(true);//展开所有节点
}
}
};
$(document).ready(function(){
var t = $("#tree");
t = $.fn.zTree.init(t, setting);
$("#treeDiv").height($(window).height()-120);//根据网页可视高度设置树的高度
$("#iframeDiv").height($(window).height()-120);
});
function refreshTree(){//刷新节点
var treeObj = $.fn.zTree.getZTreeObj("tree");
treeObj.reAsyncChildNodes(selectNode, "refresh",false);
}
function func(){
var treeObj = $.fn.zTree.getZTreeObj("tree");
var nodes = treeObj.getCheckedNodes(true);//获取复选框选中的节点集合
}
</script>
<div>
<table>
<tr>
<td width=260px align=left valign=top style="BORDER-RIGHT: #999999 1px dashed">
<div class="zTreeDemoBackground" id="treeDiv">
<ul id="tree" class="ztree" style="width:200px; overflow:auto;"></ul>
</div>
</td>
<td align='left' valign='top' width="100%">
<div id="iframeDiv">
<iframe ID="testIframe" Name="testIframe" FRAMEBORDER=0 SCROLLING=AUTO width="100%" height="100%" SRC="<%=request.getContextPath()%>/login/unit/orgUnitListPage.do"></iframe>
</div>
</td>
</tr>
</table>
</div>
</body>
</html>
zTree使用心得
最新推荐文章于 2023-09-17 20:58:14 发布