SpringMVC中使用zTree

最新推荐文章于 2021-03-02 12:44:45 发布

weixin_33825683

最新推荐文章于 2021-03-02 12:44:45 发布

阅读量186

点赞数

文章标签： java 测试前端 ViewUI

1 前端页面

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>左侧树形导航栏</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
	<link rel="stylesheet" href="./css/demo.css" type="text/css">
	<link rel="stylesheet" href="./css/zTreeStyle.css" type="text/css">
	<script type="text/javascript" src="./js/jquery-1.7.2.min.js"></script>
	<script type="text/javascript" src="./js/jquery.ztree.core-3.5.js"></script>
	
	<SCRIPT type="text/javascript">
		var setting = {	
		treeNodeKey : "id", //在isSimpleData格式下，当前节点id属性
 		treeNodeParentKey : "pId", //在isSimpleData格式下，当前节点的父节点id属性
 		showLine : true, //是否显示节点间的连线
 		checkable : true //每个节点上是否显示 CheckBox
		};
		var zNodes;
		$(function(){
			$.ajax({
				async:false,
				cache:false,
				type:'POST',
				//dataType:"String",
				url:'${pageContext.request.contextPath}/TestZTree',
				success:function(data){
					zNodes = data;
				},error:function(){
					alert("请求失败");
				}
			});
		});
		/*
		var zNodes =[
			{ id:1, pId:0, name:"父节点1", open:true},
			{ id:2, pId:0, name:"父节点2", open:true},
			{ id:3, pId:0, name:"父节点3",  open:true}
		   ];
		*/
			$(document).ready(function(){
			treeNodes = eval("(" + zNodes + ")");  //将string类型转换成json 
			$.fn.zTree.init($("#tree"), setting, treeNodes);
		   });
	</SCRIPT>
  </head>
  <body>
<div class="content_wrap">
	<div class="zTreeDemoBackground left">
		<ul id="tree" class="ztree"></ul>
	</div>
</div>
  </body>
</html>

2.后台代码

@Controller
@SessionAttributes("userT")
public class Test {
	@RequestMapping("TestZTree")
	public @ResponseBody String TestZTree() {
		Tree s1 = new Tree(1,0,"test1",true);
		Tree s2 = new Tree(2,0,"test2",true);
		Tree s3 = new Tree(3,0,"test3",true);
		Tree s4 = new Tree(4,0,"test4",true);
		Tree s5 = new Tree(5,0,"test5",true);
		Tree s6 = new Tree(6,0,"test6",true);
		Tree s7 = new Tree(7,0,"test7",true);
		Tree s8 = new Tree(8,0,"test8",true);
		Tree s9 = new Tree(9,0,"test9",true);
		Tree s10 = new Tree(10,0,"test10",true);
		Tree s11 = new Tree(11,0,"test11",true);
		List<Tree> lstTree = new ArrayList<Tree>();
		lstTree.add(s1);
		lstTree.add(s2);
		lstTree.add(s3);
		lstTree.add(s4);
		lstTree.add(s5);
		lstTree.add(s6);
		lstTree.add(s7);
		lstTree.add(s8);
		lstTree.add(s9);
		lstTree.add(s10);
		lstTree.add(s11);
		return makeTree(lstTree);
	}
	public static String makeTree(List<Tree> roles){
		//Check Roles is null
		StringBuffer sb = new StringBuffer();
		Tree r = null;
			sb.append("[");
			for(int i=0;i<roles.size();i++){
				r=(Tree) roles.get(i);
				sb.append("{id:").append(r.getId()).append(",pId:").append("0").append(",name:\"")
				.append(r.getName()).append("\"").append(",open:true").append("},");
			}
			return sb.substring(0,sb.length()-1)+"]";
	}

效果图：

weixin_33825683

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
SpringMVC中使用zTree

1 前端页面&lt;%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%&gt;&lt;%String path = request.getContextPath();String basePath = request.getScheme()+"://"+request.getServerName()...
复制链接

扫一扫