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