Question

我是jsTree的新手，我有两个问题。

* 说明：* 我有许多基于其ID和类型的层次结构的jsTree，我正在尝试实现按需加载技术。在页面加载时，我只显示没有子节点的第一个层次结构（根节点）。然后当我点击任何一个节点时，我会根据它的id和它的类型检索该特定节点的子节点（采用JSON格式）。 jsTree在浏览器上成功附加了层次结构，但它无法确认被点击的节点是已加载节点的父节点（逻辑上我希望这样，因为我没有告诉jsTree这样做）。那么，现在我的问题来了： -

1）如何动态将此单击的节点作为这些已加载节点的父节点？。

2。）我必须双击jsTree的节点才能加载相应的子节点。如何只需单击一下即可完成此操作？

提前致谢。

这是我的代码：

   In the Servlet, I have the following conditional statements:-

           if(type.equals("root"))
           {
            String jsonString = TreeTest.getRoot().getString("data");
            out.write(jsonString);
           }
           else if(type.equals("rig"))
           {
             String jsonString = TreeTest.getSecondHierarchy(Integer.parseInt(id)).getString("data");
             out.write(jsonString);
           }
           else if(type.equals("well"))
           {
             String jsonString = TreeTest.getThirdHierarchy(Integer.parseInt(id)).getString("data");
             out.write(jsonString);  
           }

我为每次调用返回的JSONObject都是

的形式

“data”：{ “data”：“node_name”， “attr”：{“id”：node_id，“type”：“node_type”} }

        Here is my jsTree codes 

          $(document).ready(function(){

              $("#tree").jstree({

                     "themes": {"theme": "classic"},

                     "core" : { 
                            "strings" : { 
                              "loading" : "Loading data..." 
                            } 
                      },

                     "json_data": {


                     "ajax" : {
                      "type": 'GET',
                       "url": "TreeViewServlet",

                       "data": function(n)
                       { 
                        return{ 
                            "id" : n.attr ? n.attr("id") : 0,
                            "type": n.attr? n.attr("type"): "root"
                        };

                       }

                    }
                   },


                "types" : {
                 "types" : {

                    "rig" : {
                        "icon" : {
                            "image" : "./images/Rig.gif"
                        }
                    },
                    "well" : {
                        "icon" : {
                            "image" : "./images/Well.gif"
                        }
                    },

                    "assysystype" : {
                        "icon" : {
                            "image" : "./images/whxt.gif"
                        }
                    },
                    "assy" : {
                        "icon" : {
                            "image" : "./images/Assy.gif"
                        }
                    },

                 "_Drl-WH" : {
                    "icon" : {
                        "image" : "./images/w_icon.gif"
                    }
                },
                 "_Compl-XT" : {
                    "icon" : {
                        "image" : "./images/x_icon.gif"
                    }
                },

                "subAssy" : {
                   "icon" : {
                        "image" : "./images/subass.gif"
                    }
                  }  
                }
              },
               "plugins" : ["themes","json_data","ui", "core", "types"]


            }).delegate(".jstree-open>a", "click.jstree", function(event)
                        {
                          $.jstree._reference(this).close_node(this,false,false);
                        }).delegate(".jstree-closed>a", "click.jstree", function(event)
                        {
                          $.jstree._reference(this).open_node(this,false,false);
                        });
                 });

Answer 1

我解决了自己的问题并决定发表答案： -

1）我必须得到点击节点的ID并将其发送到Java Servlet，然后Servlet处理请求并返回该节点的所有子节点的JSON字符串，然后使用AJAX，我将子节点附加到树。

2）有一个魔术键，对于每个节点，我添加了 "state" : "closed" ，就是这样。

动态地将单击的节点作为已加载节点的父节点 - jsTree

1 个答案: