web树zTree-增强版

古城微笑少年丶 2022-05-19 04:05 301阅读 0赞

之前发布了一个有关于web树得案例，今天我在这个案例上又增加了一些小的细节性的问题，包括如何添加新节点，在那里添加新节点等等。这样在网页中的web树就是一个棵动态的web树木了就不是静态的web树了，比较灵活。步骤跟前一个博客差不多，在这里我就不多写了。直接列出来代码，不懂得先看我上一个博客，看懂那个在看这个就明白了。

> 引导图：

![70][]

>  数据库图：

![70 1][]

代码如下：

> TreeDao：
> 
> package com.nyist.cn.Dao;
> 
> import java.util.List;
> 
> import javax.mail.Address;
> 
> import org.apache.commons.dbutils.QueryRunner;  
> import org.apache.commons.dbutils.handlers.BeanHandler;  
> import org.apache.commons.dbutils.handlers.BeanListHandler;
> 
> import com.nyist.cn.Utils.JDBCUtil;  
> import com.nyist.cn.model.Tree;
> 
> public class TreeDao \{
> 
>     public List<Tree> getAll()\{  
>         try \{  
>             QueryRunner runner = new QueryRunner(JDBCUtil.getDataSource());  
>             String sql="select child.id,child.name,child.lft,child.rgt,count(child.name) depth from category parent,category child where child.lft>=parent.lft and child.rgt<=parent.rgt group by(child.name) order by child.lft;";  
>             List<Tree> list = (List<Tree>)runner.query(sql, new BeanListHandler(Tree.class));  
>             return list;  
>         \} catch (Exception e) \{  
>             e.printStackTrace();  
>             throw new RuntimeException();  
>         \}  
>     \}  
>       
>     public void addTree(Tree tree)\{  
>         try \{  
>             QueryRunner runner = new QueryRunner(JDBCUtil.getDataSource());  
>             String sql = "insert into category(id,name,lft,rgt) values(?,?,?,?);";  
>             Object params\[\] = \{tree.getId(),tree.getName(),tree.getLft(),tree.getRgt()\};  
>             runner.update(sql, params);  
>         \} catch (Exception e) \{  
>             throw new RuntimeException(e);  
>         \}  
>     \}  
>       
>     public Tree find(String id)\{  
>         try \{  
>             QueryRunner runner = new QueryRunner(JDBCUtil.getDataSource());  
>             String sql = "select \* from category where id = ?";  
>             Tree t = (Tree) runner.query(sql, id,new BeanHandler(Tree.class));  
>             System.out.println("t:"+t.getId()+":"+t.getName());  
>             sql = "select \* from category where lft <= ? and rgt >= ? order by lft;";  
>             Object params\[\]=\{t.getLft(),t.getRgt()\};  
>             List<Tree> trees = (List<Tree>) runner.query(sql,params,new BeanListHandler(Tree.class));  
>             System.out.println("trees:"+trees.toString());  
>             t.setParent(trees);  
>             return t;  
>         \} catch (Exception e) \{  
>             e.printStackTrace();  
>             throw new RuntimeException();  
>         \}  
>     \}  
>       
>       
>     public void update(int rgt)\{  
>         try \{  
>             QueryRunner runner = new QueryRunner(JDBCUtil.getDataSource());  
>             String sql1 = "update category set lft=lft+2 where lft > ?";  
>             String sql2 = "update category set rgt=rgt+2 where rgt >= ?";  
>             String sql3 = "update category set rgt=rgt-2 where lft = ?";  
>             runner.update(sql1,rgt);  
>             runner.update(sql2,rgt);  
>             runner.update(sql3,rgt);  
>         \} catch (Exception e) \{  
>             e.printStackTrace();  
>             throw new RuntimeException();  
>         \}  
>     \}  
> \}  
>

> Model：Tree.java
> 
> package com.nyist.cn.model;
> 
> import java.io.Serializable;  
> import java.util.ArrayList;  
> import java.util.List;
> 
> public class Tree implements Serializable\{  
>     private String id;  
>     private String name;  
>     private int lft;  
>     private int rgt;  
>     private int depth;  
>       
>     List parent = new ArrayList();  
>       
>     public String getId() \{  
>         return id;  
>     \}  
>     public void setId(String id) \{  
>         this.id = id;  
>     \}  
>     public String getName() \{  
>         return name;  
>     \}  
>     public void setName(String name) \{  
>         this.name = name;  
>     \}  
>     public int getLft() \{  
>         return lft;  
>     \}  
>     public void setLft(int lft) \{  
>         this.lft = lft;  
>     \}  
>     public int getRgt() \{  
>         return rgt;  
>     \}  
>     public void setRgt(int rgt) \{  
>         this.rgt = rgt;  
>     \}  
>     public int getDepth() \{  
>         return depth;  
>     \}  
>     public void setDepth(int depth) \{  
>         this.depth = depth;  
>     \}  
>     public List getParent() \{  
>         return parent;  
>     \}  
>     public void setParent(List parent) \{  
>         this.parent = parent;  
>     \}  
>     public Tree() \{  
>         super();  
>     \}  
>     public Tree(String id, String name, int lft, int rgt, int depth, List parent) \{  
>         super();  
>         this.id = id;  
>         this.name = name;  
>         this.lft = lft;  
>         this.rgt = rgt;  
>         this.depth = depth;  
>         this.parent = parent;  
>     \}  
> \}  
>

> Service层：TreeService
> 
> package com.nyist.cn.Service;
> 
> import java.util.List;  
> import java.util.UUID;
> 
> import com.nyist.cn.Dao.TreeDao;  
> import com.nyist.cn.model.Tree;
> 
> public class TreeService \{  
>       
>     public List getAllTree()\{  
>         TreeDao dao = new TreeDao();  
>         List<Tree> tree = dao.getAll();  
>         return tree;  
>     \}  
>       
>     public void addTree(String id,String name)\{  
>         TreeDao dao = new TreeDao();  
>         Tree tree = dao.find(id);            //获得父节点  
>         System.out.println("父节点右值:"+tree.getRgt());  
>         //生成一个节点  
>         Tree t = new Tree();  
>         t.setId(UUID.randomUUID().toString());  
>         t.setName(name);  
>         t.setLft(tree.getRgt());  
>         t.setRgt(tree.getRgt()+1);  
>         dao.addTree(t);  
>         dao.update(tree.getRgt());  
>     \}  
>       
>     public Tree findTrees(String id)\{  
>         TreeDao dao = new TreeDao();  
>         return dao.find(id);  
>     \}  
>       
>     public void updateTree(int rgt)\{  
>         TreeDao dao = new TreeDao();  
>         dao.update(rgt);  
>     \}  
> \}  
>

> Servlet：AddTreeServlet
> 
> public class AddTree extends HttpServlet \{  
>     @Override  
>     public void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException \{  
>         request.setCharacterEncoding("UTF-8");  
>         response.setCharacterEncoding("UTF-8");  
>         try \{      
>             String pid = request.getParameter("pid");  
>             String name = request.getParameter("name");  
>             TreeService tree = new TreeService();  
>             tree.addTree(pid, name);  
>             request.getSession().setAttribute("message","添加成功");  
>             request.getRequestDispatcher("/message.jsp").forward(request, response);  
>         \} catch (Exception e) \{  
>             request.getSession().setAttribute("message","添加失败");  
>             e.printStackTrace();  
>             throw new RuntimeException();  
>         \}  
>     \}  
> \}

>  Servlet：ListTreeServlet
> 
> public class ListTreeServlet extends HttpServlet\{  
>       
>     @Override  
>     public void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException \{  
>         TreeService service = new TreeService();  
>         List<Tree> list = service.getAllTree();  
>         request.getSession().setAttribute("list",list);  
>         request.getRequestDispatcher("/listtree.jsp").forward(request, response);  
>     \}
> 
> \}

> Servlet：ViewTreeServlet
> 
> public class ViewTreeServlet extends HttpServlet \{
> 
>     @Override  
>     public void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException \{  
>         String id = request.getParameter("id");  
>         TreeService service = new TreeService();  
>         Tree tree = service.findTrees(id);  
>         request.getSession().setAttribute("tree",tree);  
>         request.getRequestDispatcher("/viewTree.jsp").forward(request, response);  
>     \}  
> \}

>  sql:Tree.sql
> 
> create table category  
> (  
>     id varchar(40) primary key,  
>     name varchar(100),  
>     lft int,  
>     rgt int  
> );  
> insert into category values('1','汽车',1,20);  
> insert into category values('2','奥迪',2,7);  
> insert into category values('3','奔驰',8,13);  
> insert into category values('4','兰博基尼',14,19);  
> insert into category values('5','奥迪A4',3,4);  
> insert into category values('6','奥迪A6',5,6);  
> insert into category values('7','宝马E系列',9,10);  
> insert into category values('8','宝马S系列',11,12);  
> insert into category values('9','兰博基尼suv',15,16);  
> insert into category values('10','兰博基尼Aventador',17,18);  
>

> JSP:listtree.jsp
> 
>  <body>  
>     <script type="text/javascript">  
>             <c:forEach var="c" items="$\{list\}">  
>                 <c:if test="$\{c.depth==1 \}">  
>                       var tree = new WebFXTree('$\{c.name\}');  
>                       tree.action='$\{pageContext.request.contextPath\}/ViewTreeServlet?id=$\{c.id\}';  
>                       tree.target='right';  
>                   </c:if>  
>                     
>                 <c:if test="$\{c.depth==2\}">  
>                     var node$\{c.depth\} = new WebFXTreeItem('$\{c.name\}');  
>                     tree.add(node$\{c.depth\});  
>                     node$\{c.depth\}.action='$\{pageContext.request.contextPath\}/ViewTreeServlet?id=$\{c.id\}';  
>                       node$\{c.depth\}.target='right';  
>                 </c:if>  
>                   
>                 <c:if test="$\{c.depth>2\}">  
>                     var node$\{c.depth\} = new WebFXTreeItem('$\{c.name\}');  
>                     node$\{c.depth-1\}.add(node$\{c.depth\});  
>                     node$\{c.depth\}.action='$\{pageContext.request.contextPath\}/ViewTreeServlet?id=$\{c.id\}';  
>                       node$\{c.depth\}.target='right';  
>                 </c:if>              
>             </c:forEach>  
>             document.write(tree);  
>     </script>  
>   </body>

> JSP：main.jsp
> 
> <frameset cols="16%,\*">  
>       <frame src="$\{pageContext.request.contextPath \}/ListTreeServlet" name="left">  
>       <frame src="" name="right">  
>   </frameset>

>  JSP：ViewServlet.jsp
> 
> <body>  
>     <span>您所在的位置是:</span>  
>     <c:forEach var="p" items="$\{tree.parent \}">  
>         <span>$\{p.name \} >>> </span>  
>     </c:forEach>  
>       
>     <br/>  
>     <br/>  
>     <span>ID:$\{tree.id \}</span> &nbsp;&nbsp;&nbsp;<span>分类名称:$\{tree.name \}</span><br/>  
>       
>     <br/>  
>     <br/>  
>     <br/>  
>     <form action="$\{pageContext.request.contextPath \}/AddTree" method="post">  
>         <input type="hidden" name="pid" value="$\{tree.id \}"/>  
>         <span>子节点:</span><input placeholder="请输入新节点的名称" type="text" name="name"/>&nbsp;  
>         &nbsp;  
>         <input type="submit" value="提交"/>  
>     </form>  
>   </body>

结果如下图：

![70 2][]

[70]: /images/20220519/75fd2e1811b34819be247b5f5f231d8c.png
[70 1]: /images/20220519/693ddff1a527486b9c9509ab8a9d0cfc.png
[70 2]: /images/20220519/f9e0d7a957c24eb58f39d9afb4ddabc9.png