easyui-tree/combotree使用说明打开指定节点，找到指定节点位置，查找当前的节点处于第几级

本文为jQuery-EasyUI组件tree扩展方法说明

包含以下内容：

• 树形结构基本说明
• 继承于tree的combotree
• 打开指定节点
• 查找当前节点处于第几级
• 附录Java的Tree实体文件

---

树形结构基本说明

1. 样子
   
2. 数据格式
   
3. 数据如何绑定
   分两种数据加载模式，第一种使用远程读取数据，通过get或post请求接口获得数据内容，也可以直接读取json文件

$('#tt').tree({    
    //url:'tree_data.json'
    url:'/tree/find'
});  

另一种方式是使用静态数据，若需要将已经存在的数据放入控件，则直接使用自定义绑定data即可

$('#tt').tree({
    data: [{
        text: 'Item1',
        state: 'closed',
        children: [{
            text: 'Item11-1'
        },{
            text: 'Item11-2'
        }]
    },{
        text: 'Item2'
    }]
});

继承于tree的combotree

因为combotree既继承combo又继承tree，而其内的基础结构是属于combo的，只有在内包装了tree。所以要调用tree里面的方法，在conbotree的基础上先得获取到它的tree，取得tree内容后，参考tree的方法进行对应操作即可。

$('#tt').combotree('tree');

打开指定节点

因内容涉及到tree部分，则需要利用刚刚的内容，之后再使用expendTo方法打开对应节点，因为需要target对象，所以我们只能通过id去找target对象，下面也封装了一个方法，调用传参即可

//方法传参为target，也就是说得获取到那个树形节点的对象才行
$('#'+treeid).combotree('tree').tree('expandTo', target);

/**
 * 打开tree的指定节点，其他节点为默认关闭
 * @param treeid  树ID
 * @param openid  要打开的节点ID
 */
function tree_expandTo(treeid, openid) {
    $('#'+treeid).combotree('tree').tree('expandTo', 
            $('#'+treeid).combotree('tree').tree('find', openid).target);
}

查找当前节点处于第几级

本方法直接扩展加入了easyui-tree的方法内，直接调用即可

/**
 * 扩展easyui tree插件，得到当前结点的级数(即第几级)
 * 调用如下:
 * var node = $('#menus').tree("getSelected");
 * var lv =  $('#menus').tree("getLevel",node.target);
 */
$.extend($.fn.tree.methods, {
    getLevel:function(jq,target){
        var l = $(target).parentsUntil("ul.tree","ul");
        return l.length+1;
    }
});

附录提供Tree.java封装

import java.io.Serializable;
import java.util.List;

/**
 * 对应EasyUI前端Tree封装
 * @author around
 * @date 2018-4-26
 */
public class Tree implements Serializable {

    private static final long serialVersionUID = 5350719828301693594L;

    private String id;

    private String text;

    private String url;

    /** 'state'可用值有：'checked','unchecked','indeterminate' */
    private String state;

    private String iconCls;

    private String description;

    private List<Tree> children;

    /** 上级ID */
    private String pid;

    private boolean checked;


    public List<Tree> getChildren() {
        return children;
    }
    public void setChildren(List<Tree> children) {
        this.children = 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 getUrl() {
        return url;
    }
    public void setUrl(String url) {
        this.url = url;
    }
    public String getState() {
        return state;
    }
    public void setState(String state) {
        this.state = state;
    }
    public String getIconCls() {
        return iconCls;
    }
    public void setIconCls(String iconCls) {
        this.iconCls = iconCls;
    }
    public String getDescription() {
        return description;
    }
    public void setDescription(String description) {
        this.description = description;
    }
    public String getCode() {
        return code;
    }
    public void setCode(String code) {
        this.code = code;
    }
    public String getNavigation() {
        return navigation;
    }
    public void setNavigation(String navigation) {
        this.navigation = navigation;
    }
    public String getPid() {
        return pid;
    }
    public void setPid(String pid) {
        this.pid = pid;
    }
    public boolean isChecked() {
        return checked;
    }
    public void setChecked(boolean checked) {
        this.checked = checked;
    }

}

作者精通easyUI相关复杂操作和自定义扩展，有疑难杂症可以联系我噢！