EasyUI实现异步加载tree(整合Struts2)
首先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() }表结构如图
首先查询所有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的方法进行了封装
import java.sql.Connection; import java.sql.DriverManager; import java.sql.ResultSet; import java.sql.SQLException; import java.sql.Statement; public class ConnectionManager { public static final String DRIVER = "com.mysql.jdbc.Driver"; public static final String URL = "jdbc:mysql://localhost:3306/easyui"; public static final String USERNAME = "root"; public static final String PASSWORD = "root"; /** * 通过静态代码块 注册数据库驱动 */ static { try { Class.forName(DRIVER); } catch (ClassNotFoundException e) { e.printStackTrace(); } } /** * 获得Connection * * @return */ public static Connection getConnection() { Connection conn = null; try { conn = DriverManager.getConnection(URL, USERNAME, PASSWORD); } catch (SQLException e) { e.printStackTrace(); } return conn; } /** * 关闭ResultSet * * @param rs */ public static void closeResultSet(ResultSet rs) { if (rs != null) { try { rs.close(); } catch (SQLException e) { e.printStackTrace(); } } } /** * 关闭Statement * * @param st */ public static void closeStatement(Statement st) { if (st != null) { try { st.close(); } catch (SQLException e) { e.printStackTrace(); } } } /** * 关闭Connection * * @param conn */ public static void closeConnection(Connection conn) { if (conn != null) { try { conn.close(); } catch (SQLException e) { e.printStackTrace(); } } } /** * 关闭全部 * * @param rs * @param sta * @param conn */ public static void closeAll(ResultSet rs, Statement sta, Connection conn) { closeResultSet(rs); closeStatement(sta); closeConnection(conn); } }效果如图:
项目源码下载:http://download.csdn.net/detail/itmyhome/7852021
转载请注明出处:http://blog.csdn.net/itmyhome1990/article/details/38818449