1.引入css和js
<script type="text/javascript" src="${base}/resources/admin/js/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="${base}/resources/admin/js/jquery.validate.js"></script>
<script type="text/javascript" src="${base}/resources/admin/js/jquery.ztree.core-3.0.js"></script>
<script type="text/javascript" src="${base}/resources/admin/js/jquery.ztree.excheck-3.0.js"></script>
<script type="text/javascript" src="${base}/resources/admin/js/jquery.ztree.exedit-3.0.js"></script>
2.js代码
<script type="text/javascript">
var $deleteButton = $("#deleteButton");
var setting = {
data: {
simpleData: {
enable: true
}
}
,edit: {
enable: true,
showRemoveBtn: true,
showRenameBtn: false
}
,callback: {
onClick: onClick,
onRemove: onRemove
//onCheck:onCheck
}
};
function onClick(event, treeId, treeNode, clickFlag)
{
$("#iframe").attr("src","${base}/admin/navigation/edit.jhtml?id="+treeNode.id);
}
function onRemove(e, treeId, treeNode)
{
location.href="delete.jhtml?ids="+treeNode.id;
}
$().ready(function() {
[@flash_message /]
onloadf();
});
function onloadf()
{
$.ajax({
type:"post",
url:"getData.jhtml",
success:function(data)
{
$.fn.zTree.init($("#treeDemo"), setting, eval(data));
}
})
}
function SetWinHeight(obj)
{
var win=obj;
if (document.getElementById)
{
if (win && !window.opera)
{
if (win.contentDocument && win.contentDocument.body.offsetHeight)
win.height = win.contentDocument.body.offsetHeight;
else if(win.Document && win.Document.body.scrollHeight)
win.height = win.Document.body.scrollHeight;
}
}
}
</script>
3.html代码
<div style="width:15%;height:1000px;float:left;background-color:#daf3fd">
<div class="bar">
<a href="add.jhtml" class="iconButton">
<span class="addIcon"> </span>添加
</a>
<a href="javascript:;" id="refreshButton" class="iconButton">
<span class="refreshIcon"> </span>${message("admin.common.refresh")}
</a>
</div>
<ul id="treeDemo" class="ztree" style="width:15%;height:100%;"></ul>
</div>
4.java代码
@RequestMapping(value = "/getData", method = RequestMethod.POST,produces = "application/json; charset=utf-8")
@ResponseBody
public String getData()
{
JSONObject json = new JSONObject();
List<HashMap<String,Object>> list = new ArrayList<HashMap<String,Object>>();
List<Navigation> alls = navigationService.findAll();
for(int i = 0; i < alls.size(); i++)
{
HashMap<String,Object> hm = new HashMap<String,Object>(); //最外层,父节点
Navigation n = alls.get(i);
hm.put("id", n.getId());//id属性 ,数据传递
hm.put("name", n.getName()); //name属性,显示节点名称
hm.put("pId", n.getParent()==null?0:n.getParent().getId());
hm.put("isParent", n.getParent()==null?true:navigationService.isParent(n));
list.add(hm);
}
JSONArray arr = new JSONArray(list);
try {
json.put("success", true);
json.put("arr", arr);
} catch (JSONException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
return arr.toString();
}
5.效果