对于Ext中的tree组件相信大家一定不会陌生,也是Ext最为大家所公认并且最得意的组件之一,步入正题:
一·首先,我们需要在前端的页面建立一个树。注意了,关键在于我们定义的loader属性。这里面需要写上我们在struts的配置文件上面配置的action路径。OK!前端的设计就是这样了。
var leftTree = new Ext.tree.TreePanel({
id : 'leftTree',
collapsible : true,
width : 200,
Height : 500,
autoScroll : true,
split : true,
renderTo : 'tree_panel',
loader : new Ext.tree.TreeLoader({
dataUrl : context + '/article/search.ao?method=treeArticle',
method : 'post'
})
})
特别需要注意loader属性中Url的路径:
dataUrl : context + '/article/search.ao?method=treeArticle',
二·对于我们如何来写Action,我需要赘述一下。我么可以看一下API中写的静态树的例子。例子里面的数据全部都写成了JSON格式,当然我们也可以写成别的格式再进行解析。我只着重说一下JSON格式的数据。
String json = articleBo.getJsonTreeDate();
return returnAjax(request, response, json);
三·完成BO层的设计。鉴于我们需要返回Json的格式--Key-value类型的格式,所以我们使用Map集合来存放所筛选出的结果就再合适不过了!我想说Map集合就是JSON,我们将TreeNode需要的属性全部以Key-value的形式存入Map集合中,这样一个Map集合就是一个结点信息。可是有些朋友可能还会有问题:Map集合里面存的只是一个节点的信息,那么我的树怎样才能添加很多的节点呢? 相当好的问题,我们可以建立一个List集合,专门来存放这些Map集合。这里可能需要一些关于泛型的知识,大家有空可以去看看,不过这种方式肯定是没有问题的。
这个是BO层中getJsonTreeDate()的部分代码
String hql = " from TArticle where TArticle.isAudit = 1";
List<TArticle> list = this.dao.query(hql);
List<Map<String, String>> maplist = new ArrayList<Map<String, String>>();
for (TArticle articleObj : list)
{
Map<String, String> map = new HashMap<String, String>();
map.put("id", articleObj.getId().toString());
map.put("text", articleObj.getTitle());
map.put("leaf", "true");
if (articleObj.getIsAudit().toString() == "1" && articleObj.getIsElite().toString() == "1")
{
map.put("iconCls", "");
} else if (articleObj.getIsAudit().toString() == "0" && articleObj.getIsElite().toString()
== "1")
{
map.put("iconCls", "");
} else if (articleObj.getIsAudit().toString() == "1" && articleObj.getIsElite().toString()
== "0")
{
map.put("iconCls", "");
} else
{
map.put("iconCls", "");
}
maplist.add(map);
}
对于Map集合的使用我再说明一下,有时我们定义好的Map集合的泛型,可是我们发现就像上面的一样,最初设计的时候我们的逻辑是将Map的泛型定义成一个实体类,可是最后我们放进去的是一个List集合。不能对List进行强转,这样会报错的。所以我们还是应当将Map的泛型定义成Object,这样就避免了很多的麻烦