【问题标题】:Create a dynamic treeview with json data - dynatree in jsp使用 json 数据创建动态树视图 - jsp 中的 dynatree
【发布时间】:2013-10-05 06:52:25
【问题描述】:

我在数据库中有一个这样的表:

id   -   title   -  parentID
-----------------------------
1        Root          null
2        item 1        1
3        item 2        1
4        item 3        1
5        item 3.1      4

这应该创建如下内容:

--Root
----item 1
----item 2
----item 3
-------item 3.1

这是获取根节点及其子节点的控制器:

@RequestMapping(value="/CourtBranch/LoadTreeView", method = RequestMethod.GET)
    public void LoadList(@RequestParam("ParentId") String parentID,HttpServletRequest req, HttpServletResponse resp) {
        List lst;
        if (parentID.equals("Root"))
        {
            lst = _COURTBRANCH.LoadTreeChildren(null, "Root");   // selects records which have parent=null
        }
        else
        {
            lst = _COURTBRANCH.LoadTreeChildren(parentID, "TreeNode");   // selects records which have parent=parentID
        }

        resp.setContentType("application/json");
        resp.setCharacterEncoding("utf-8");
        try {
            resp.getWriter().print(_gson.toJson(lst));
        } catch (IOException e) {
            e.printStackTrace();
        }
    }

这个脚本会加载我的根目录:

<script type="text/javascript">
  $(function(){
    $("#tree").dynatree({
          initAjax: {
              url: "/CourtBranch/LoadTreeView.json?ParentId=Root",
              data: { mode: "funnyMode" }
              },
      onActivate: function(node) {
        $("#echoActive").text(node.data.title);
      },
      onDeactivate: function(node) {
        $("#echoActive").text("-");
      }
    });
  });
</script>

现在我需要知道如何将 root 的 id 发送到我的控制器以获取 root 的孩子 并将它们添加到根节点。 我应该使用 appendAjax 函数吗?怎么样?

【问题讨论】:

    标签: java json jsp spring-mvc dynatree


    【解决方案1】:

    我完全按照弗朗索瓦所说的做了,而且成功了!谢谢..只是微小的变化,因为由于某种原因我的 JSON 没有被解析。我没有推出 MyTree.java 和 MyNode.java,因为它们是非常基本的简单类。

    public class MYDocTreeManager {
    
    private MYTree MYTree = new MYTree();
    
    private String sDir = "C:\\Users\\sandeepraj.tandon\\Documents\\DynaTreeFolder";
    
    
    public void buildMYTree(){
    
    
        System.out.println("Top Level Starts");
        File[] faFiles = new File(sDir).listFiles();
         int key = 1;
          for(File file: faFiles){
              MYNode MYNode = new MYNode();
              MYNode.setTitle(file.getName());
              MYNode.setTooltip(file.getName());
              MYNode.setKey(String.valueOf(key));
              MYTree.addNode(MYNode);         
    
            if(file.getName().matches("^(.*?)")){
              System.out.println(file.getName()+" is a file at top level");
            }
            if(file.isDirectory()){
                MYNode.isFolder(true);              
    
    
    
              //System.out.println(file.getAbsolutePath()+"is a directory at top level");
              //String treeJson = file.getAbsolutePath()+"is a directory at top level";
              addChildToNodeRec(MYNode,file.getAbsolutePath(), key);
            }
    
            key++;
    
    
          }
    
    }
    
    
    private void addChildToNodeRec(MYNode MYNode,String currDirPath, int key){
    
        System.out.println("Scanning under "+MYNode.getTitle());
        int childKey = 1;
        File[] faFiles = new File(currDirPath).listFiles();
        for(File file: faFiles){
            MYNode childNode = new MYNode();
            childNode.setTitle(file.getName());
    
            MYNode.setKey(String.valueOf(key)+"."+childKey);
            MYNode.addChild(childNode);
            if(file.getName().matches("^(.*?)")){
    
                System.out.println("Found a document "+file.getName());
            }
            if(file.isDirectory()){             
                System.out.println("Found a directory "+file.getName());
                MYNode.isFolder(true);
                addChildToNodeRec(childNode,file.getAbsolutePath(), childKey);
            }   
    
            childKey++;
    
          }
    
    
    }
    
    
    /**
     * Get the JSON object for the tree built
     * @return
     */
     public String treeToJason() {
         StringBuffer json =new StringBuffer();
         json.append("[\r");
         int topNodeCount = 0;
        for (MYNode topNode:MYTree.getTopLevelNodes()){
            //System.out.println("topNode title :"+topNode.getTitle());
            //json = json.append("topNode title :"+topNode.getTitle()+"\n");
            if(topNodeCount==0){
                json.append("{\"title\": \"" + topNode.getTitle() + "\", \"key\": \"" + topNode.getKey() + "\", \"children\": [\r");
            } else {
                json.append(", \n {\"title\": \"" + topNode.getTitle() + "\", \"key\": \"" + topNode.getKey() + "\", \"children\": [\r");
            }
            //json = json.append("topNode title :"+topNode.getTitle()+"\n");
            childNodeJson(json, topNode);
    
            topNodeCount++;
        }
    
              json.append("]");
         return json.toString();
         //   return MYTree.toJson(MYTree);
     }
    
    
    private void childNodeJson(StringBuffer json, MYNode node) {
        int childCount = 0;
        for (MYNode child : node.getChildren()){
    
            //System.out.println("Child No."+childCount+" of "+topNode.getTitle()+" is :"+child.getTitle()+"\n");   
            //json.append("Child No."+childCount+" of "+topNode.getTitle()+" is :"+child.getTitle()+"\n");
             if (childCount == 0) {
                    json.append("\t\t");
                    json.append("{\"title\": \"" + child.getTitle() + "\", \"key\": \"" + child.getKey() + "\"");
             } else {
    
                    json.append(",");
                    json.append("\n\t\t");
                    json.append("{\"title\": \"" + child.getTitle() + "\", \"key\": \"" + child.getKey() + "\"");
             }
            if(child.getChildren().size()>0){
                json.append(",\"children\": [\r");
                childNodeJson(json, child);
            } else {
                json.append("}");
            }
            childCount++;
        }
    
         json.append("\n\t\t]}");
    
    
    
    }
    
     public static void main(String args[]){
    
    
         MYDocTreeManager MYDocTreeManager  = new MYDocTreeManager();
         MYDocTreeManager.buildMYTree();
         System.out.println(MYDocTreeManager.treeToJason());
     }
    

    }

    按照此处的讨论更改了我的实现 https://stackoverflow.com/a/35608588/5436115

    【讨论】:

      【解决方案2】:

      基本上,您并不想直接在控制器中执行此操作。 (松散耦合)

      我会创建 2 个实用程序类 Tree&lt;T&gt;Node&lt;T&gt; 来管理您的树和节点:

      这是树类:

      public class Tree<T> {
      
          private Node<T> rootElement;
      
          public Tree() {
              super();
          }
      
          public Node<T> getRootElement() {
              return this.rootElement;
          }
      
          public void setRootElement(final Node<T> rootElement) {
              this.rootElement = rootElement;
          }
      
          public List<Node<T>> toList() {
              final List<Node<T>> list = new ArrayList<Node<T>>();
              walk(this.rootElement, list);
              return list;
          }
      
          private void walk(final Node<T> element, final List<Node<T>> list) {
              list.add(element);
              for (final Node<T> data : element.getChildren()) {
                  walk(data, list);
              }
          }
      }
      

      还有带有一些辅助方法的节点类

      public class Node<T> {
      
          private T data;
          private List<Node<T>> children;
      
          public Node() {
              super();
          }
      
          public Node(final T data) {
              this();
              setData(data);
          }
      
          public Boolean hasChildren() {
              return this.children.size() != 0;
          }
      
          public List<Node<T>> getChildren() {
              if (this.children == null) {
                  return new ArrayList<Node<T>>();
              }
              return this.children;
          }
      
          public void setChildren(final List<Node<T>> children) {
              this.children = children;
          }
      
          public int getNumberOfChildren() {
              return this.children.size();
          }
      
          public void addChild(final Node<T> child) {
              if (this.children == null) {
                  this.children = new ArrayList<Node<T>>();
              }
              this.children.add(child);
          }
      
          public void insertChildAt(final int index, final Node<T> child) throws IndexOutOfBoundsException {
              if (index == getNumberOfChildren()) {
                  addChild(child);
                  return;
              } else {
                  this.children.get(index);
                  this.children.add(index, child);
              }
          }
      
          public void removeChildAt(final int index) throws IndexOutOfBoundsException {
              this.children.remove(index);
          }
      
          public T getData() {
              return this.data;
          }
      
          public void setData(final T data) {
              this.data = data;
          }
      }
      

      然后我会让你的树扩展树。基于您的控制器 CourtBranch

      假设您的 CourtBranch 模型具有以下结构(我使用的是 hibernate + jpa):

      @Entity
      @Table
      public class CourtBranch
      
      private String id;
      private String name;
      private Long partentId;
      
      //getters setters etc...
      

      创建一个扩展树的类:

      public class CourtBranchTree extends Tree<CourtBranch>
          public CourtBranchTree{
              super();
          }
      

      现在创建您的 TreeGridResponse 类:

      public class TreeGridResponse {
          //inject the service to get the id of your model
          @Resource
          CourtBranchService cbService;
          //if you are using a repository for the db queries:
          @Resource
          CourtBranchRepository cbRepo;
      
          public TreeGridResponse(){
          }
      
          //returning the tree as a JSON to use AJAX
          public String cbBTreeAsJson(final CourtBranchTree tree){
              final StringBuffer sb = new StringBuffer();
              final CourtBranch root = tree.getRootElement().getData();
              sb.append("[\r {\"title\": \"" + root.getName() + "\", \"key\": \"" + root.getId() + "\", \"children\": [\r");
              final List<Node<CourtBranch>> children = tree.getRootElement().getChildren();
              loopforChildre(sb, children);
              sb.append("]");
              return sb.toString();
          }
      
          private StringBuffer loopForChildren(final StringBuffer sb, final List<Node<UserRight>> children) {
              for (int i = 0; i < children.size(); i++) {
                  final Node<courtBranch> childElement = children.get(i);
                  if (i == 0) {
                      sb.append("{\"title\": \"" + childElement.getData().getName() + "\", \"key\": \"" + childElement.getData().getId() + "\"");
                  } else {
                      sb.append(", {\"title\": \"" + childElement.getData().getName() + "\", \"key\": \"" + childElement.getData().getId() + "\"");
                  }
                  if (childElement.hasChildren()) {
                      sb.append(", \"children\": [\r");
                      loopForChildren(sb, childElement.getChildren());
                  } else {
                      sb.append("}");
                  }
              }
              sb.append("]}");
              return sb;
          }
      
          public CourtBranchTree get() {
              final CourtBranchTreetree tree = new CourtBranchTree();
              final Node<CourtBranch> root = new Node<CourtBranch> (this.cbRepo.findOne(Long.valueOf(1)));//gets your root
              getRecursive(root, tree);
              tree.setRootElement(root);
              return tree;
          }
      
          private void getRecursive(final Node<CourtBranch> courtBranch, final CourtBranchTree tree) {
              final List<CourtBranch> children = this.cbService.findCourtBranchByParentId(courtBranch.getData().getId());
              final List<Node<CourtBranch>> childElements = new ArrayList<Node<CourtBranch>>();
              for (final CourtBranch childCourtBranch : children) {
                  final Node<CourtBranch> childElement = new Node<CourtBranch>(childUserRight);
                  childElements.add(childElement);
                  getRecursive(childElement, tree);
              }
              courtBranch.setChildren(childElements);
          }
      }
      

      在您的配置中注册 TreeGridResponse 以获取 bean 并将其注入您的控制器。

      @Controller
      public class CBController
      
      @Resource
      private TreeGridResponse gridResponse;
      
      @RequestMapping(value="/CourtBranch/LoadTreeView", method = RequestMethod.GET, produces = MediaType.APPLICATION_JSON_VALUE)
      @ResponseBody
      public String cbTree() {
          return this.gridResponse.cbBTreeAsJson(this.gridResponse.get());
      }
      

      注意 @ResponseBody 注释,它将指示 Spring 将您的字符串解析为 JSON,以便您的 AJAX 可以读取它。

      还有你的jsp:

      <div id ="cbTree"></div>
      <script type ="text/javascript">
          $(function(){
          $("#cbTree").dynatree({
              initAjax:{
                  url: /CourtBranch/LoadTreeView
                  },
              checkbox: true,
              selectMode: 3
          });
          });
      </script>
      

      希望这会有所帮助...

      【讨论】:

        猜你喜欢
        • 2016-02-22
        • 2013-09-17
        • 2012-02-24
        • 2013-08-11
        • 2016-11-02
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多