Question

我在使用MVC2项目中使用的JsTree时遇到问题。我想创建一个函数来取消选择/关闭树上的所有节点。然后打开一个特定的节点，并选择一个特定的子节点（我有两个Id值）。

问题是在open_node完成之前总是调用select_node，因此未选择节点，因为树尚未加载数据，并且节点ID不存在。

我首先尝试了这个功能。

$('#demo3').jstree('deselect_all');
$('#demo3').jstree('close_all');
$('#demo3').jstree("open_node", $('#ParentId'), false, true); 
$('#demo3').jstree("select_node", $('#ChildId'));

然后我尝试将代码移动到select_node和move_node树的绑定，但没有运气。目前我使用setTimeout（），这是一个可怕的解决方案。

有没有人知道如何告诉树只在打开完成后选择节点？

Answer 1

您可以尝试传递一个选择节点作为回调的函数，如：

$('#demo3').jstree('open_node', '#ParentID', function(e, data) {
    $('#demo3').jstree('select_node', '#ChildId');
}, true);

这样，一旦open_node返回成功，就会调用select_node。

Answer 2

我目前正在MVC4项目中使用它。

如果配置open_node函数加载节点JSON（在“core”插件中将load_open设置为true），则新添加的节点存在于服务器端，但其DOM元素仍然不是因为open_node函数没有完成它的工作。因此，您需要等待或使用第二个参数（成功回调）。在回调中，在DOM树中呈现的新节点及其选择器有效。

jsTree配置示例：

"core": {
   "open_parents": true,
   "load_open": true
 }

我的工作代码：

$("iframe#UploadTarget").load(function () {
  var result = jQuery.parseJSON($(this).contents().text());
  if (result.Result == true) {
     $("#uploadDialog").dialog("close");
     var tree = jQuery.jstree._focused();

     /* 
        open_node will open the parent, get the childs from the server 
        (controller) and renders the new item before the callback executed,
        so the jQuery selector will be valid 
     */

     tree.open_node(result.ParentId,/*CALLBACK*/ function () {
          var newNode = $("#" + result.Id);
          tree.select_node(newNode, false, null);
     });

   } else {
      alert(result.Result + ":" + result.ResultDescription);
   }

});//GOOD LUCK :-)

Answer 3

希望这可能会有所帮助，抱歉我没有使用json。我正在使用jstree和函数来通过点击jstree的html之外的元素来打开节点。

我们设置中的每个节点都像一个网页，所以在仪表板的主页上我们有最近编辑的页面列表。

每个链接都有这个javascript来执行

<a href="javascript: selectLeftNavNode(339);">Edit</a>

其中339是我们要编辑的页面的ID

这是以前执行的函数

function selectLeftNavNode(node) {
        $('#demo').jstree('deselect_all');
        $('#demo').jstree('select_node', '#node_' + node);
}

我们最近注意到的问题是，如果最近编辑的页面位于树的深处，更具体地说是在尚未加载的部分中它将失败

这就是我决定向服务器发出ajax请求以便检索所有父ID的原因

更改下面的代码，在我的情况下，ajax将返回类似于xml

的内容

<?xml version="1.0" encoding="UTF-8"?>
<response>
<paths>
<path>339</path>
<path>338</path>
<path>38</path>
</paths>
</response>

和功能

function selectLeftNavNode(node) {
        $('#demo').jstree('deselect_all');
        if($('#demo').jstree('select_node', '#node_' + node) === false) 
        { 
            // if it is false means that the node is not yet rendered
            // so instead of loading we will require to get list of parent nodes to open in order, then it will become available
            // an ajax call should get us all the nodes
            $.ajax({
                type: "POST",
                dataType: "xml",
                url: your_url_to_php_script',
                data: {node_id:node},
                success: function(data)
                {
                    var remaining_nodes = new Array();
                    var paths_count = $(data).find('response').find('path').length;
                    for(var x=1;x<=paths_count;x++){
                       remaining_nodes[x-1] = $(data).find('response').find('paths path:nth-child('+x+')').text(); 
                    }

                    open_nodes_step_by_step(remaining_nodes);
                }
            });
        }
    }

除了在open_node的回调中循环的函数之外，该函数逐个节点地打开，当它到达应该是我们想要选择的实际节点id的最后一个条目时，它将使用select_node而不是

function open_nodes_step_by_step(remaining_nodes)
{
    var nodes = remaining_nodes.slice();
    tree = jQuery.jstree._focused();
    if(nodes.length > 1){
        var nodes_left = remaining_nodes.slice();
        nodes_left.pop();
        var to_open = nodes.length - 1;
         tree.open_node(document.getElementById('node_' + nodes[to_open]), /*CALLBACK*/ function () {
            open_nodes_step_by_step(nodes_left);
         });
    }
    else{
        tree.select_node('#node_' + nodes[0]); 
    }
}

我已经用IE8，FF和Chrome测试了我的解决方案似乎工作得很好，最重要的是我使用jQuery v1.10.1和jsTree 1.0-rc1（不幸的是，因为代码已经存在多年了，现在它拥有所有数据库和其他集成我决定不更改为新版本，它的工作原理）

希望我帮助过某人

汤姆

JsTree打开一个节点，然后选择一个子节点（使用json_result）

3 个答案: