Как я могу узнать, полностью ли загружена jsTree?

Я пытаюсь написать функцию, которая открывает определенные узлы в jsTree, но у меня возникает проблема, когда функция выполняется до того, как мое базовое дерево загружается из вызова ajax. Как узнать, загружены ли данные jstree и дождаться загрузки. Ниже приведена функция, которую я пытаюсь использовать.

function openNodes(tree, nodes) {
    for (i in nodes) {
        $('#navigation').jstree("open_node", $(nodes[i]));
    }
}

Я загружаю свое начальное дерево с помощью следующей команды

$("#navigation").jstree({
    "json_data": {
        "ajax": {
            "url": function(node) {
                var url;
                if (node == -1) {
                    url = "@Url.Action("BaseTreeItems", "Part")";
                } else {
                    url = node.attr('ajax');
                }
                return url;
            },
            "dataType": "text json",
            "contentType": "application/json charset=utf-8",
            "data": function(n) { return { id: n.attr ? n.attr("id") : 0, ajax: n.attr ? n.attr("ajax") : 0 }; },
            "success": function() {
            }
        }
    },
    "themes": { "theme": "classic" },
    "plugins": ["themes", "json_data", "ui"]
});

Ответ 1

Я использовал setInterval и clearInterval:

var interval_id = setInterval(function(){
     // $("li#"+id).length will be zero until the node is loaded
     if($("li#"+id).length != 0){
         // "exit" the interval loop with clearInterval command
         clearInterval(interval_id)
         // since the node is loaded, now we can open it without an error
         $("#tree").jstree("open_node", $("li#"+id))
      }
}, 5);

JStree ".loaded" callback работает только для корневых узлов; "._is_loaded" может работать вместо проверки длины node, но я не пробовал. В любом случае, настройки анимации заставляют узлы, которые глубже в дереве загружаться через несколько миллисекунд позже. Команда setInterval создает синхронизированный цикл, который завершается, когда загружаются ваши node (ы).

Ответ 2

Прежде чем вы вызовете .jstree() для элемента, вы можете привязать свои обратные вызовы к событиям before.jstree и loaded.jstree:

$(selector)
.bind('before.jstree', function(e, data) {
    // invoked before jstree starts loading
})
.bind('loaded.jstree', function(e, data) {
    // invoked after jstree has loaded
    $(this).jstree("open_node", $(nodes[i]));
})
.jstree( ... )

Ответ 3

В более поздних версиях jstree вам может потребоваться дождаться завершения загрузки всех узлов до их взаимодействия с ними. Для этого вам необходимо:

ready.jstree

Итак:

$(selector)
    .bind('ready.jstree', function(e, data) {
        // invoked after jstree has loaded
     })
...

Ответ 4

Вам лучше позвонить в $.ajax(), чтобы сначала получить нужные вам данные, вы можете вызвать функцию $(). jstree() в поле success: field, как ниже, мой код.

    var fullTree;
$.ajax({
  url :"./php/select_tree.php",
  data : fullTree,
  method : "GET",
  dataType : "json",
  success : function(fullTree){
    $("#jstree").jstree({
      "core" : {
        "data" :fullTree,
        "check_callback" : true
       },
       "plugins" : [ "contextmenu", "dnd", "changed", "wholerow" ]
    });
  }
})
;

Ответ 5

Я использую событие refresh.jstree в моем случае (мне нужно динамически изменять и обновлять узлы в jstree очень часто).

Согласно документу, это

срабатывает при завершении вызова обновления

jsTree Doc (События)

Пример кода:

$.post( [url], ... ).done(function(){ $jstree.jstree().settings.core.data = result; $jstree.jstree().refresh(); }); $(selector).on('refresh.jstree', function(){ // do something });

Ответ 6

Вам не нужно добавлять интервал. Плагин устанавливает класс на node, который он загружает через ajax.

.one("reselect.jstree", function (evt, data) {
        if ($("#MYTREEID").find(".jstree-loading").length == 0) {
            alert('my ajax tree is done loading");
        }
    })

Ответ 7

[Отказ от ответственности: это не относится к OP, так как плагин состояния не указан в коде установки.]

Если вы используете плагин состояния, используйте событие state_ready.jstree вместо событий ready.jstree илиloaded.jstree.

$(selector).on('state_ready.jstree', function () {
    // open desired node
})