页面加载时向后台发送请求获取tree数据
$(function(){
$('#tree').tree({
url:'${pageContext.request.contextPath }/document/getMenuList',
animate:true,
checkbox:true,
onlyLeafCheck:true,//叶子结点添加复选框
onClick:function(node){//单击node事件
alert(node.text);
},
onContextMenu: function(e, node){ //给结点添加右键菜单
e.preventDefault(); //阻止右键默认事件
var root = $('#tree').tree('getParent', node.target)//判断该结点有没有父结点
if(root == null){//若成立则为根结点,添加一个右键样式,可以添加子节点
$('#parentNode').menu('show', {
left: e.pageX,
top: e.pageY
});
}
var leaf = $('#tree').tree('isLeaf', node.target);
var parentOne = $('#tree').tree('getParent', node.target);
var parentTwo = $('#tree').tree('getParent', parentOne.target);
if(leaf && parentTwo != null){//本项目要求tree只有3层,若此时条件成立,说明已经是最底层(第三层),右键菜单去除添加节点
$('#leaf').menu('show', {
left: e.pageX,
top: e.pageY
});
}else{//此时说明还可以添加子节点
$('#parentNode').menu('show', {
left: e.pageX,
top: e.pageY
});
}
}
});
})
节点右键菜单代码,添加在body体中
<ul id="tree" style="margin:16px"></ul>
<div id="leaf" class="easyui-menu" style="width: 120px;">
<div οnclick="removeNode()" iconcls="icon-remove">删除节点</div>
<div οnclick="updateNode()" iconcls="icon-edit">修改节点</div>
</div>
<div id="parentNode" class="easyui-menu" style="width: 120px;">
<div οnclick="addNode()" iconcls="icon-add">添加节点</div>
<div οnclick="updateNode()" iconcls="icon-edit">修改节点</div>
</div>
后台java代码
controller层
@RequestMapping(value = "/getMenuList", method = RequestMethod.POST)
public ResponseEntity<?> getMenuList(){
List<VEasyuiTree> vtList = new ArrayList<VEasyuiTree>();
vtList = folderService.getMenuList();
return new ResponseEntity<Object>(vtList, HttpStatus.OK);
}
service 层
@Override
public List<VEasyuiTree> getMenuList() {
List<VEasyuiTree> vtList = new ArrayList<VEasyuiTree>();
List<Folder> parents = folderDao.findRootNode();//获取顶级父节点,该字段一般为空,或为特殊值
if(parents.size() >0){
for(Folder folder: parents){
VEasyuiTree vEasyuiTree = getTree(folder);//查询该父节点下所有子节点,并转换成easyui-tree数据样式
vtList.add(vEasyuiTree);
}
}
return vtList;
}
public VEasyuiTree getTree(Folder folder){
List<VEasyuiTree> vtList = new ArrayList<VEasyuiTree>();
//转换成Easyui数据
VEasyuiTree model = GetVTree(folder);
List<Folder> childs = GetFolderByParentId(folder.getId());
if (!childs.isEmpty()){
//递归子节点
int j = 0;
for(Folder e: childs){
VEasyuiTree vt = GetVTree(e);
vtList.clear();
vtList.add(j, vt);
model.setChildren(vtList);
List<Folder> lf = GetFolderByParentId(e.getId());
if(lf.size() > 0){
int i = 0;
for(Folder ele:lf){
List<VEasyuiTree> vtList1 = new ArrayList<VEasyuiTree>();
VEasyuiTree vEasyuiTree = model.getChildren().get(j);
VEasyuiTree vts = GetVTree(ele);
vtList1.add(i, vts);
vEasyuiTree.setChildren(vtList1);
i++;
}
}
j++;
}
}
return model;
}
private VEasyuiTree GetVTree(Folder folder) {
VEasyuiTree vt = new VEasyuiTree();
vt.setId(folder.getId());
vt.setState("close");
vt.setText(folder.getFolder_name());
return vt;
}
VEasyuiTree 实体类code
<pre name="code" class="java">import java.util.List;
public class VEasyuiTree {
private String id;
private String text;
private String state;
private boolean ischecked;
private Object attributes;
private List<VEasyuiTree> children;
public String getId() {
return id;
}
public void setId(String id) {
this.id = id;
}
public String getText() {
return text;
}
public void setText(String text) {
this.text = text;
}
public String getState() {
return state;
}
public void setState(String state) {
this.state = state;
}
public boolean isIschecked() {
return ischecked;
}
public void setIschecked(boolean ischecked) {
this.ischecked = ischecked;
}
public Object getAttributes() {
return attributes;
}
public void setAttributes(Object attributes) {
this.attributes = attributes;
}
public List<VEasyuiTree> getChildren() {
return children;
}
public void setChildren(List<VEasyuiTree> children) {
this.children = children;
}
}