异步树控件:
树控件内建异步加载模式的支持,用户先创建一个空的树,然后指定 一个服务器端没执行检索后动态返回JSON数据来填充树并完成异步请求。
下面一个例子展示商品类型树;
表结构如下:
CREATE TABLE `tb_item_cat` ( `id` bigint(20) NOT NULL AUTO_INCREMENT COMMENT '类目ID', `parent_id` bigint(20) DEFAULT NULL COMMENT '父类目ID=0时,代表的是一级的类目', `name` varchar(50) DEFAULT NULL COMMENT '类目名称', `status` int(1) DEFAULT '1' COMMENT '状态。可选值:1(正常),2(删除)', `sort_order` int(4) DEFAULT NULL COMMENT '排列序号,表示同级类目的展现次序,如数值相等则按名称次序排列。取值范围:大于零的整数', `is_parent` tinyint(1) DEFAULT '1' COMMENT '该类目是否为父类目,1为true,0为false', `created` datetime DEFAULT NULL COMMENT '创建时间', `updated` datetime DEFAULT NULL COMMENT '创建时间', PRIMARY KEY (`id`), KEY `parent_id` (`parent_id`,`status`) USING BTREE, KEY `sort_order` (`sort_order`) ) ENGINE=InnoDB AUTO_INCREMENT=1183 DEFAULT CHARSET=utf8 COMMENT='商品类目';
初始化树的请求的url: /item/cat/list
参数:
初始化tree时,只需要把第一级节点展示,子节点异步加载。
long id(父节点id)
返回值: json 。数据格式如下:
[{
"id": 1,
"text": "Node 1",
"state": "closed"
},{
"id": 2,
"text": "Node 2",
"state": "closed"
}]
state:如果节点下有子节点“closed”,如果没有子节点“open”
创建一个pojo来描述tree的节点信息,包含三个属性id、text、state。
public class EasyUITreeNode implements Serializable{ 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; } }
查询的表:
tb_item_cat
查询列:
Id、name、isparent
查询条件parentId
service处理:
@Override public List<EasyUITreeNode> getCatList(long parentId) { // 1、根据parentId查询节点列表 TbItemCatExample example = new TbItemCatExample(); //设置查询条件 Criteria criteria = example.createCriteria(); criteria.andParentIdEqualTo(parentId); List<TbItemCat> list = itemCatMapper.selectByExample(example); // 2、转换成EasyUITreeNode列表。 List<EasyUITreeNode> resultList = new ArrayList<>(); for (TbItemCat tbItemCat : list) { EasyUITreeNode node = new EasyUITreeNode(); node.setId(tbItemCat.getId()); node.setText(tbItemCat.getName()); node.setState(tbItemCat.getIsParent()?"closed":"open"); //添加到列表 resultList.add(node); } // 3、返回。 return resultList; } }