對於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,這樣就避免了很多的麻煩