Spring MVC+ ztree动态实现

     石总，给安排了一个任务，用树形结构显示资源列表，并带复选框，提供可选择的机制。

         最初，想起周围的同学好多完成了树的，自己也做过一次树，但是是写死的，好在，我有一种不怕死的，敢于承担的，乐于负责的精神，高兴的接手了这个工作。

一定要会看帮助手册， 这在以后的学习和工作中都很重要。

且看实现：

1. JSP页面

需要引入的相应的css

demo.css,zTreeStyle.css

需要引入的响应的js

jquery.min.js，jquery.ztree.core-3.5.js,jquery.ztree.excheck-3.5.js

 

树所在的位置：

<div>
      <ul id="treeOperate"class="ztree"></ul>
</div>

相应的初始化的javascript

<scripttype="text/javascript">
 
varzOperateNodes;
 
<%--运营后台管理的树的数据--%>
$.ajax({
async:false,
cache:false,
type:'POST',
dataType:'json',
url:"${ctx}/role/treeOperateJson",
error:function(){
alert('请求失败');
},
success:function(data){
alert(data);
zOperateNodes=data;
}
})
 
varsetting={
isSimpleData:true,
treeNodeKey:"id",
treeNodeParentKey:"pId",
showLine:true,
expandSpeed:"fast",//展开速度
callback:{
//click:zTreeOnClick
//点击事件
},
check:{
enable:true
},
data:{
simpleData:{
enable:true
}
}
};
 
$(document).ready(function(){
/*运营后台树的初始化*/
$.fn.zTree.init($("#treeOperate"),setting,zOperateNodes);
 
setting.check.chkboxType={"Y":"ps","N":"ps"};
})
</script>

2. 后台controller 方法

/*运营后台的管理的数据来源*/
 
@RequestMapping(value="treeOperateJson")
publicModelAndViewoperateTree(Stringid,HttpServletResponseresponse)throwsIOException{
//查询所有的资源
List<Resource>lsResource=resourceService.findAll();
//将所有的资源列表转换为需要的格式
List<TreeNode>treeNodeList=Resource2TreeNode(lsResource);
TreeNodetreetotalNode=newTreeNode("0","0","运营后台管理",false);
treeNodeList.add(treetotalNode);
 
Gsongson=newGson();
 
response.setCharacterEncoding(("utf-8"));
PrintWriterpw=response.getWriter();
System.out.println(gson.toJson(treeNodeList));
pw.print(gson.toJson(treeNodeList));
pw.flush();
pw.close();
returnnull;
}
//循环转换将Resource2Node
privateList<TreeNode>Resource2TreeNode(List<Resource>resourceList){
List<TreeNode>TreeNodeList=newArrayList<TreeNode>();
for(Resourceresource:resourceList){
if(resource.getParentResource()==null){
 
TreeNodetreeNode=newTreeNode(resource.getId(),"0",resource.getRemark(),false);
TreeNodeList.add(treeNode);
}else{
TreeNodetreeNode=newTreeNode(resource.getId(),resource.getParentResource().getId(),resource.getRemark(),false);
TreeNodeList.add(treeNode);
}
}
returnTreeNodeList;
}

         其实这次完成的技术点并不难，在这短短的7天之中，我发现人的心态对于某件事的成功与否起到的作用是非常大的，对于树这一块，我之前，并没有真正实现过，但还是相信自己可以做成功，然后就真成功了。“相信自己能成”的心态真的很重要。