JSP中使用EasyUI實現非同步載入tree(整合Struts 2)

首先jsp頁面有一ul用於展現Tree

<ul id="mytree"></ul>

載入Tree

<script type="text/javascript">      $('#mytree').tree({             url:'treeLoad.action'    });   </script>

配置Action

<struts>      <package name="tree_json" extends="json-default">          <action name="treeLoad" method="treeLoad" class="com.home.web.TreeAction">              <result type="json">                  <param name="root">treeNodes</param>              </result>          </action>      </package>  </struts>

注意：

1.extends是json-default,表示返回json對象格式。

2.result中param的name為root,裡面設定的值就是action中要返回的JSON對象

需要封裝對象Tree

public class TreeNode {      private static final long serialVersionUID = 1L;      private String id;   // 節點id      private String text; // 顯示的節點文本      private String state = "open"; // 節點狀態,'open'或者'closed',預設是'open'      private boolean checked;       // 指明檢查節點是否選中.            public TreeNode() {}            public TreeNode(String id, String text, String state, boolean checked) {          this.id = id;          this.text = text;          this.state = state;          this.checked = checked;      }            //...省略setXX() getXX()        }

表結構如圖

<img width="" height="" " src="gif/201409051228502161.gif" />

首先查詢所有parentid為空白值的資料,然後同時判斷該節點下是否有子節點，如果有則狀態是關閉狀態

當繼續展開樹的時候 會將該ID值傳入,然後查詢該節點的子節點。

action方法實現

import java.sql.Connection;  import java.sql.ResultSet;  import java.sql.SQLException;  import java.sql.Statement;  import java.util.ArrayList;  import java.util.List;        import com.home.util.ConnectionManager;        /**  * 查詢資料使用JDBC進行操作   *  */public class TreeAction {      private List<TreeNode> treeNodes = new ArrayList<TreeNode>(); //返回的JSON資料      private String id; // 樹組件使用的ID            public String treeLoad() {                Statement sta = null;          ResultSet rs = null;          try {              Connection conn = ConnectionManager.getConnection();              sta = conn.createStatement();              String sql = "";              if (id == null) {  //如果id為null則是根節點                   sql = "select * from easyui_tree where parentid = ''";              } else {           //查詢下面的子節點                   sql = "select * from easyui_tree where parentid = " + id;              }              rs = sta.executeQuery(sql);                    while (rs.next()) {                  String id = rs.getString("id");                  String name = rs.getString("name");                  TreeNode node = new TreeNode();                  node.setId(id);                  node.setText(name);                  node.setChecked(false);                  //判斷是否有子節點，如果有則closed否則open                  if(isChildrenNode(id)){                      node.setState("closed");                  }else{                      node.setState("open");                  }                                        treeNodes.add(node);              }              // 關閉所有資源              ConnectionManager.closeAll(rs, sta, conn);          } catch (SQLException e) {              e.printStackTrace();          }                return "success";      }            /**      * 判斷是否有子節點      *       * @return      */    public boolean isChildrenNode(String id) {          Boolean flag = false;          Statement sta = null;          ResultSet rs = null;          try {              Connection conn = ConnectionManager.getConnection();              sta = conn.createStatement();              String sql = "select * from easyui_tree where parentid = " + id;              rs = sta.executeQuery(sql);              while (rs.next()) {                  flag = true;              }              // 關閉所有資源              ConnectionManager.closeAll(rs, sta, conn);          } catch (SQLException e) {              e.printStackTrace();          }          return flag;      }                  public List<TreeNode> getTreeNodes() {          return treeNodes;      }            public void setTreeNodes(List<TreeNode> treeNodes) {          this.treeNodes = treeNodes;      }            public String getId() {          return id;      }            public void setId(String id) {          this.id = id;      }        }

對擷取Connection的方法進行了封裝

更多精彩內容：http://www.bianceng.cnhttp://www.bianceng.cn/webkf/ajax/