dtree樹形菜單簡例

從http://www.destroydrop.com/javascripts/tree/下載dtree.zip壓縮包，解壓後我們會用到 dtree.js、dtree.css和img文件夾。

1.TreeInfo.java

package com.yxx;

public class TreeInfo {
　　　 private int nodeId = -1;
　　　 private int parentId = -1;
　　　 private String nodeName = null;
　　　 private String url = null;
　　　 private String target = null;

　　　 public int getNodeId() {
　　　　　　　 return nodeId;
　　　 }

　　　 public void setNodeId(int nodeId) {
　　　　　　　 this.nodeId = nodeId;
　　　 }

　　　 public int getParentId() {
　　　　　　　 return parentId;
　　　 }

　　　 public void setParentId(int parentId) {
　　　　　　　 this.parentId = parentId;
　　　 }

　　　 public String getNodeName() {
　　　　　　　 return nodeName;
　　　 }

　　　 public void setNodeName(String nodeName) {
　　　　　　　 this.nodeName = nodeName;
　　　 }

　　　 public String getUrl() {
　　　　　　　 return url;
　　　 }

　　　 public void setUrl(String url) {
　　　　　　　 this.url = url;
　　　 }

　　　 public String getTarget() {
　　　　　　　 return target;
　　　 }

　　　 public void setTarget(String target) {
　　　　　　　 this.target = target;
　　　 }

}

2.TreeUtil.java

package com.yxx;

import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.util.ArrayList;
import java.util.List;

public class TreeUtil {

　　　 /** *//**
　　　　 * @從數據庫中讀取tree的信息
　　　　 * @return
　　　　 */
　　　 public static List<TreeInfo> retrieveNodeInfos() {
　　　　　　　 List<TreeInfo> treeInfoList = new ArrayList<TreeInfo>();
　　　　　　　 String driverName = "com.mysql.jdbc.Driver";
　　　　　　　 String url = "jdbc:mysql://localhost:3306/test";

　　　　　　　 Connection connection = null;
　　　　　　　 PreparedStatement preparedStatement = null;
　　　　　　　 ResultSet rs = null;
　　　　　　　 try {
　　　　　　　　　　　 Class.forName(driverName).newInstance();
　　　　　　　　　　　 connection = DriverManager.getConnection(url, "root", "1234");
　　　　　　　　　　　 String sql = "select * from tree_info";
　　　　　　　　　　　 preparedStatement = connection.prepareStatement(sql);
　　　　　　　　　　　 rs = preparedStatement.executeQuery();

　　　　　　　　　　　 TreeInfo treeInfo = null;
　　　　　　　　　　　 while (rs != null && rs.next()) {
　　　　　　　　　　　　　　　 treeInfo = new TreeInfo();
　　　　　　　　　　　　　　　 treeInfo.setNodeId(rs.getInt(1));
　　　　　　　　　　　　　　　 treeInfo.setParentId(rs.getInt(2));
　　　　　　　　　　　　　　　 treeInfo.setNodeName(rs.getString(3));
　　　　　　　　　　　　　　　 treeInfo.setUrl(rs.getString(4));
　　　　　　　　　　　　　　　 treeInfoList.add(treeInfo);
　　　　　　　　　　　 }
　　　　　　　 } catch (Exception e) {
　　　　　　　　　　　 System.out.println(e);
　　　　　　　 }

　　　　　　　 return treeInfoList;
　　　 }

　　　 /** *//**
　　　　 * @生成創建tree的腳本
　　　　 * @param treeInfoList
　　　　 * @return
　　　　 */
　　　 public static String createTreeInfo(List<TreeInfo> treeInfoList) {
　　　　　　　 StringBuffer contents = new StringBuffer();
　　　　　　　 contents.append("<script type='text/javascript'>\n");
　　　　　　　 contents.append("d = new dTree('d');\n");

　　　　　　　 TreeInfo treeInfo = null;
　　　　　　　 for (int i = 0; i < treeInfoList.size(); i++) {
　　　　　　　　　　　 treeInfo = (TreeInfo) treeInfoList.get(i);
　　　　　　　　　　　 contents.append(createOneItem(treeInfo));
　　　　　　　 }

　　　　　　　 contents.append("document.write(d);");
　　　　　　　 contents.append("\n</script>");
　　　　　　　 return contents.toString();
　　　 }

　　　 /** *//**
　　　　 * @生成創建一個條目的腳本
　　　　 * @param treeInfo
　　　　 * @return
　　　　 */
　　　 public static String createOneItem(TreeInfo treeInfo) {
　　　　　　　 StringBuffer item = new StringBuffer();
　　　　　　　 item.append("d.add(");
　　　　　　　 // 第一個參數，表示當前節點的ID
　　　　　　　 item.append(treeInfo.getNodeId() + ",");
　　　　　　　 // 第二個參數，表示當前節點的父節點的ID,根節點的值為 -1
　　　　　　　 item.append(treeInfo.getParentId() + ",");
　　　　　　　 // 第三個參數，節點要顯示的文字
　　　　　　　 item.append("'" + treeInfo.getNodeName() + "',");
　　　　　　　 // 第四個參數，節點的Url
　　　　　　　 item.append("'" + treeInfo.getUrl() + "',");
　　　　　　　 // 第五個參數，鼠標移至該節點時節點的Title
　　　　　　　 item.append("'" + treeInfo.getNodeName() + "',");
　　　　　　　 // 第六個參數，節點的target
　　　　　　　 item.append("'blank',");
　　　　　　　 // 第七個參數，用做節點的圖標,節點沒有指定圖標時使用默認值
　　　　　　　 item.append("'',");
　　　　　　　 // 第八個參數，用做節點打開的圖標,節點沒有指定圖標時使用默認值
　　　　　　　 item.append("'',");
　　　　　　　 // 第九個參數，判斷節點是否打開
　　　　　　　 item.append(false);

　　　　　　　 item.append(");\n");
　　　　　　　 return item.toString();
　　　 }

　　　 /** *//**
　　　　 * @取得腳本
　　　　 * @return
　　　　 */
　　　 public String getMenuJS() {
　　　　　　　 String js = "";
　　　　　　　 List<TreeInfo> treeInfoList = TreeUtil.retrieveNodeInfos();
　　　　　　　 js = TreeUtil.createTreeInfo(treeInfoList);
　　　　　　　 return js;
　　　 }

　　　 /** *//**
　　　　 * @測試生成的JS
　　　　 * @param args
　　　　 */
　　　 public static void main(String[] args) {
　　　　　　　 List<TreeInfo> treeInfoList = TreeUtil.retrieveNodeInfos();
　　　　　　　 System.out.println(TreeUtil.createTreeInfo(treeInfoList));
　　　 }
}

3.index.jsp

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<jsp:useBean id="treeUtil" scope="request" class="com.yxx.TreeUtil" />
<html>
　　　 <head>
　　　　　　　 <title>Tree</title>
　　　　　　　 <link rel="StyleSheet" href="dtree.css" type="text/css" />
　　　　　　　 <script type="text/javascript" src="dtree.js"></script>
　　　 </head>
　　　 <body>
　　　　　　　 <div class='dtree'>
　　　　　　　　　　　 <%=treeUtil.getMenuJS()%>
　　　　　　　 </div>
　　　 </body>
</html>