树形节点异步加载

一，准备树形实体。

二，组装数据，注意一定要将父级节点的state在后端返回数据时关闭，要不在界面不会出现，可选的子节点。

三，前端处理

一，

import java.util.TreeSet;

import com.fasterxml.jackson.annotation.JsonIgnore;

import lombok.Data;
import lombok.Setter;
import lombok.AccessLevel;

/**
 * 树实体,此树结构符合easyui 的tree结构
 * 
 *
 */
@Data
public class TreeEntity implements Comparable<TreeEntity>
{
	/**
	 * 节点收缩状态标识
	 */
	public static final String STATE_CLOSED = "closed";
	/**
	 * 节点展开状态标识
	 */
	public static final String STATE_OPEN = "open";
	
	/**
	 * 空图标的样式
	 */
	public static final String NULL_ICON="icon-blank";
	/**
	 * 文件夹图标标式
	 */
	public static final String FOLDER_ICON="tree-folder";
	/**
	 * 节点id
	 */
	private String id;
	/**
	 * 节点显示文本
	 */
	private String text;
	
	/**
	 * 节点显示的图标
	 */
	private String iconCls;
	
	/**
	 * 是否勾选
	 */
	private boolean checked;
	
	/**
	 * 节点默认状态（open、closed）
	 */
	private String state;
	
	/*
	 * 父节点标识值
	 */
	private String parentId;

	/**
	 * 排序值
	 */
	private int sort;
	/*
	 * 是否已加载（用于子节点的延时加载）
	 */
	@JsonIgnore
	private boolean isLoad;
	
	/**
	 * 节点自定义属性
	 */
	private Object attributes;
	
	/**
	 * 子节点集
	 */
	@Setter(AccessLevel.PROTECTED)
	private TreeSet<TreeEntity> children;

	public TreeEntity()
	{
		children=new TreeSet<TreeEntity>();
	}
	
	/**
	 * 构造节点
	 * @param sId
	 * @param sText
	 * @param sParentId
	 * @param iSort
	 * @param sIcon 节点图标样式定义（null表示默认图标，""表示使用空图标）
	 */
	public TreeEntity(String sId,String sText,String sParentId,int iSort,String sIcon)
	{
		this();
		id=sId;
		text=sText;
		parentId=sParentId;
		sort=iSort;
		if(sIcon!=null){
			if(sIcon.isEmpty())
				sIcon=NULL_ICON;
			iconCls=sIcon;
		}
	}

	@Override
	public int compareTo(TreeEntity o)
	{
		if(o==null) return 1;
		if(this==o) return 0;//如果是同一对象，返回0（用于移除）
  	//注意：不能返回0，因为在TreeSet排序时，如果比较是0值时，会认为是在同一个位置放置元素（将会覆盖原来的元素）
		if(this.sort==o.sort){//如果排序值相同，再比较标题
			String stext=this.text;
			if(stext==null)stext="";
			int ir=stext.compareTo(o.text);
			if(ir==0){
				stext=this.id;
				if(stext==null)stext="";
				ir=stext.compareTo(o.id);
			}
			return ir==0?1:ir;//仍相等，返回大于
		}
		return (this.sort<o.sort)?-1:1;
	}
	
}

二，

public TreeEntity buildAdministrativeTree(AdministrativeDivisionEntity info)
	{
		TreeEntity root = new TreeEntity();
		root.setId(info.getCode());
		root.setText(info.getLname());
		root.setIconCls("icon-blank");
		if(info.getCode().length()<=4){
			root.setState("closed");
		}
		List<AdministrativeDivisionEntity> list = info.getChildren();
		if(list!=null&&list.size()>0){
			for(AdministrativeDivisionEntity data : list){
				root.getChildren().add(buildAdministrativeTree(data));
			}
		}
		return root;
	}

三,

1,jsp:

<input id="deptDistrict" class="easyui-combotree" style="width: 100%;"
						   data-options="editable:true"/>

2,js:

//Ajax请求，返回的内容将根据请求头MIME 信息来判断。
//url:请求地址
//data：请求数据内容
//prop：请求参数，包含属性
//  msg，操作描述，一般在不需要自己处理返回结果的情况下，能友好提示用户的信息（不设置或空，默认为“操作”）
//  sFn，执行成功后的回调方法（参数为服务器返回结果），不设置或空，默认为显示操作成功提示
//  fFn，执行失败后的回调方法（参数1为请求对象，参数2为提示信息，参数3为异常信息），不设置或空，默认为显示操作失败提示
//  async，是否异步调用请求，默认为true（即异步调用）
//  method，请求方法，默认为POST
//  jsonObj，是否将数据以json串发送请求（会使用invokeJsonObj方法发送请求）
function invokeJson(url,data,prop){
	if(!prop) prop = {};
	if(prop.jsonObj){invokeJsonObj(url,data,prop); return;}
	if(!prop.msg)  prop.msg = '操作';
	if(!prop.sFn) {prop.sFn = function(data){showSuccess(prop.msg+'成功');}};//成功的方法
	if(!prop.fFn) {prop.fFn = function(xhr,data,ex){showError(prop.msg+'失败：'+analyseError(xhr.responseText));}}//失败的方法
	if(typeof(prop.async)=="undefined" || prop.async==null) prop.async = true;
	if(!prop.method) prop.method="POST";
	else if(prop.method.toUpperCase()=="GET"){
		url=tagGetRequest(url);
	}
	$.ajax({ 
		url: url,
		type:prop.method,
		async : prop.async,
		data:data,
		success: prop.sFn,
		error: prop.fFn
	});
}

$(function(){
	var t1=$('#deptDistrict').combotree('tree');
	loadTree(t1);
	addTreeChildren(t1);
	
	
});


function addTreeChildren(tree){
	tree.tree({
		onBeforeExpand: function (node) {
			// 展开节点搜索子节点，并添加到树结构里
			if (node.children.length > 0 || node.id == 'notDefinition') {
				return;
			}
			var id = node.id;
			invokeJson("/mainWeb/mystestChildren", { code: id }, {
				method:"GET",
				async: false,
				sFn: function (data, textStatus) {
					tree.tree('append', {
						parent: node.target,
						data: data
					});
					$(node.target).next().css("display", "block");
				}, fFn: function (data) {
					layer.msg("查询失败");
				}
			});
		}
	});
}


function loadTree(t){
	var url='/mainWeb/mytest';
	invokeJson(url, null, {
		method:"GET",
		sFn: function (data) {
			t.tree({
				data: data,
				onLoadSuccess: function () { //默认折叠所有节点
					t.tree("collapseAll");
				}
			});
		}
	});
}