EasyUI combotree前后端使用总结

不所说重点上代码

使用combotree的异步加载方式；

jsp文件：

<div>
    <div>部门</div><span><input id="deptCombotree"></span>
</div>

js文件：

//初始部门列表
	$("#deptCombotree").combotree ({
		url:path+"/record/deptlist?deptid=0",  
		onBeforeExpand:function(node) {
		      $("#deptCombotree").combotree("tree").tree("options").url = path+"/record/deptlist?deptid=" + node.id;
		},
		onSelect:function(node){
			$("#RecordList2").datagrid('reload',{deptId:node.id,recodeMonth:document.getElementById("beginTime").innerHTML});
		}
	 }); 

说明：

1）、onBeforeExpand实现异步加载；

2）、onSelect实现节点选定时触发table数据重载；

3）、combotree继承了combo和tree的所有事件和方法

EasyUITreeNode.java

import java.io.Serializable;

public class EasyUITreeNode implements Serializable {
	/**
	 * 
	 */
	private static final long serialVersionUID = -3722391707720182282L;
	
	private long id;
	private String text;
	private String state;
	
	public long getId() {
		return id;
	}
	public void setId(long 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;
	}
	
	
}

说明：一定注意节点的三个属性！！

DingDeptServiceImpl.java

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;

import org.aspectj.util.GenericSignature.TypeSignature;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

import com.vooledingtalk.common.pojo.EasyUITreeNode;
import com.vooledingtalk.dao.DingDeptMapper;
import com.vooledingtalk.pojo.DingDept;
import com.vooledingtalk.service.DingDeptService;
@Service
public class DingDeptServiceImpl implements DingDeptService {
	@Autowired
	private DingDeptMapper dingDeptMapper;

	public boolean isParent(Long id) {
		return dingDeptMapper.countChildDepts(id)>0 ? true : false;
	}

	public List<EasyUITreeNode> getDeptList(long id) {
		List<EasyUITreeNode> nodes =  new ArrayList<EasyUITreeNode>();
		
		if (0 == id) {
			//仅获取id==1的部门信息
			DingDept root = dingDeptMapper.selectDeptById(1L);
			EasyUITreeNode node = new EasyUITreeNode();
			node.setId(root.getId());
			node.setText(root.getName());
			node.setState("closed");
			nodes.add(node);
		}else{
			//获取直属子部门列表
			List<DingDept> depts = dingDeptMapper.selectDirectChildDepts(id);
			for (DingDept dingDept : depts) {
				EasyUITreeNode node = new EasyUITreeNode();
				node.setId(dingDept.getId());
				node.setText(dingDept.getName());
				node.setState(isParent(dingDept.getId()) ? "closed" : "open");
				nodes.add(node);
			}
		}
		
		return nodes;
	}
}

说明：节点如果是父节点那么就是closed状态，如果是叶子节点则是open状态；

DingDeptController.java

import java.util.List;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;

import com.vooledingtalk.common.pojo.EasyUITreeNode;
import com.vooledingtalk.service.DingDeptService;

@Controller
public class DingDeptController {
	@Autowired
	private DingDeptService dingDeptService;
	
	@RequestMapping("/record/deptlist")
	@ResponseBody
	public List<EasyUITreeNode> getDeptList(@RequestParam(value="deptid" ,defaultValue="0")long parentId){
		return dingDeptService.getDeptList(parentId);
	}
}

本人文字描述功底不太好，所以就只简单上代码了。

-----------------------以下问本文的相关知识点-----------------------------------------------

一、combotree取值（转自https://my.oschina.net/u/1256202/blog/268556）

1，直接获取：
     单选：$("#id").combotree("getValue")
     多选：$("#id").combotree("getValues")
     注意：如果value中的值和所显示的文本不同，如需获取文本内容，则可以使用getText(),多选同样加s。
 2，在选择事件中获取：
     onSelect:function(node){

        node.text；或者 node.id;
     }

3，使用api中方式

    var t = $("#id").combotree('tree'); // 得到树对象  

    var n = t.tree('getSelected'); // 得到选择的节点  

    alert(n.text);