最近需要用一個在網頁上顯示一個樹形的結構，原來的javascript腳本不是很適合，就是用了xloadtee，這個東西還是很好用的，
雖然還有一點點瑕疵，但是已經很好的達到了我的要求。
大概需要做的工作：
腳本引用：
<link type="text/css" rel="stylesheet" href="<%=request.getContextPath()%>/js/xtree2.css">
<link type="text/css" rel="stylesheet" href="<%=request.getContextPath()%>/js/xtree2.links.css">
<script type="text/javascript" src="<%=request.getContextPath()%>/js/xtree2.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/js/xloadtree2.js"></script>
使用個div在頁面顯示整個樹：
<div style="position: absolute; width: 200px; top: 10px; left: 15px; height: 100%; padding: 5px; overflow: auto;">
<!-- js file containing the tree content, edit this file to alter the menu,
the menu will be inserted where this tag is located in the document -->
<script type="text/javascript">
var tree = new WebFXTree("組織結構樹");
tree.showRootNode = false;
tree.showRootLines = false;
tree.add(new WebFXLoadTreeItem("系統", "/sectiontree.do"));
tree.expandAll();
tree.write();
</script>
</div>
頁面部分即可完成，下面是服務器端的代碼：
public ActionForward execute(ActionMapping mapping, ActionForm form,
HttpServletRequest request, HttpServletResponse response)
throws Exception {
response.setContentType("text/xml; charset=gbk");
response.setHeader("Cache-Control", "no-cache");
response.setDateHeader("Expires", 0);
PrintWriter out = response.getWriter();
String id = request.getParameter("id");
Session ss = SessionHolder.getSessionHolder().currentSession();
Document doc = new Document(new Element("tree"));
if (id == null) {
// 取得根節點
String root = "select s from Section s inner join fetch s.children where s.parent.section_id is null";
Query query = ss.createQuery(root);
transfer(doc, query);
} else {
// 取得當前節點的id
int sid = Integer.parseInt(id);
String child = " from Section s where s.section_id=:id";
Query query = ss.createQuery(child);
query.setInteger("id", sid);
transfer(doc, query);
}
SessionHolder.getSessionHolder().closeSession(ss);
Format format = Format.getCompactFormat();
format.setEncoding("gbk");
format.setIndent("/t");
XMLOutputter xout = new XMLOutputter(format);
xout.output(doc, out);
out.flush();
out.close();
return null;
}
private void transfer(Document doc, Query query) {
List r = query.list();
Section s = (Section) HibernateUtil.uniqueResult(r);
for (Iterator it = s.getChildren().iterator(); it.hasNext();) {
Section one = (Section) it.next();
Element tree = doc.getRootElement();
Element inner = new Element("tree").setAttribute("text", one
.getName());
tree.addContent(inner);
if (!one.isLast())
inner.setAttribute("src", "/TechCS/sectiontree.do?id="
+ one.getSection_id());
inner.setAttribute("action", "javascript:setsection("
+ one.getSection_id() + ")");
}
}
以上部分就可以完成樹結構的服務器部分。
說明：使用struts+hibernate。