easyui treenode java_easyui tree的简单使用

1、帮助文档

所有节点都包含以下属性:

id:节点id,这个很重要到加载远程服务器数据 which is important to load remote data

text: 显示的节点文本

state: 节点状态, 'open' 或者 'closed', 默认是 'open'. 当设置为 'closed', 节点所有的子节点将从远程服务器站点加载

checked: 指明检查节点是否选中.

attributes: 可以添加到节点的自定义属性

children: 一个节点数组,定义一些子节点

一些示例:

异步加载树

tree 支持内置的异步加载模式,用户创建一个空的tree,然后定义一个远程服务器站点返回json数据用于填充tree来异步满足异步加载需求.例如:

tree的加载是通过URL  'get_data.php'站点.子节点的加载依赖于父节点的状态.当展开一个关闭节点,如果节点没有子节点加载,将发送节点id值作为http参数,参数命名为'id'到远程服务器,通过以上URL定义.检索子节点数据

看看这个从服务器返回的数据

2、前台：

$("#tree").tree({

url:'getOrgTree.do',

method: 'GET',

animate: true,

checkbox: true,

cascadeCheck:true,//层叠选中

lines:true,//显示虚线效果

onLoadSuccess:function(node,data){

var nodeDep = $('#tree').tree('find',checkeid);

if (null != nodeDep && undefined != nodeDep)

{

$('#tree').tree('check',nodeDep.target);

}

},

onCheck:function(node, checked)

{

if (checked)

{

//这段逻辑自拟

}

else

{

}

}

});

3、后台

后台这段代码个人觉得写的不好，但是又没查到怎样写，暂且先这样吧

public class OrgTree

{

private String id;

private String text;

private List children = new ArrayList();

private String state;

//getter & setter

}

@RequestMapping("/getOrgTree")

public void getOrgTree(String id, HttpServletRequest request, HttpServletResponse response)

{

List orgList = new ArrayList();

OrgModel model = new OrgModel();

String spid = "";

//父节点的id为-1

model.getBean().setParentid("-1");

//按条件查询出所有的父节点

orgList = organService.selectByCondition(model);

// 查询出所有的父节点

List otree = new ArrayList();

// 遍历所有父节点

if (null != orgList && orgList.size() > 0)

{

for (Organization o : orgList)

{

OrgTree ot = new OrgTree();

ot.setId(o.getId());

ot.setText(o.getOrgName());

OrgModel childMod = new OrgModel();

childMod.getBean().setParentid(o.getId());

//根据父节点id查询出其子节点

List orgChild = organService.selectByCondition(childMod);

if (orgChild != null && orgChild.size() > 0)

{

List list = new ArrayList();

for (Organization child : orgChild)

{

OrgTree ochild = new OrgTree();

ochild.setId(child.getId());

ochild.setText(child.getOrgName());

list.add(ochild);

}

if(list.size() 

{

ot.setState("open");

}

else

{

ot.setState("closed");

}

ot.setChildren(list);

}

otree.add(ot);

}

}

ComUtil.writerJson(response, otree);

}

效果如下：

本来是想实现每次只能选择一个选项的，但是一直有问题，问题出在那个cascadeCheck属性上，选择了一个节点时，就把另一个选中的节点给unchecked，但是由于这个层叠选中状态的，在只有一个子节点时，把父节点unchecked，但是同时子节点也就去勾选了，该功能未实现，待修改下方法在说。