23

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"]
});
4

8 に答える 8

35

要素で.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( ... )
于 2012-07-12T12:57:06.997 に答える
15

最近のバージョンのjstreeでは、すべてのノードがロードを完了するまで待ってから対話する必要がある場合があります。これを行うには、次のものが必要です。

ready.jstree

それで：

$(selector)
    .bind('ready.jstree', function(e, data) {
        // invoked after jstree has loaded
     })
...
于 2014-11-12T20:19:09.697 に答える
7

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」コールバックはルートノードに対してのみ機能します。「._is_loaded」はノードの長さをチェックする代わりに機能するかもしれませんが、私はそれを試していません。いずれにせよ、アニメーション設定により、ツリーのより深いノードが数ミリ秒後にロードされます。setIntervalコマンドは、目的のノードがロードされたときに終了する時限ループを作成します。

于 2012-12-17T21:20:56.123 に答える
4

最初に必要なデータを取得するには、$。ajax（）関数を呼び出す方がよいでしょう。成功した場合は、$（）。jstree（）関数を呼び出すことができます。

    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" ]
    });
  }
})
;
于 2015-09-26T16:08:27.800 に答える
3

私の場合はイベントを使用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 });

于 2019-01-04T08:54:08.243 に答える
2

[免責事項：状態プラグインがセットアップコードにリストされていないため、これはOPには適用されません。]

状態プラグインを使用している場合は、ready.jstreeまたはloaded.jstreeイベントの代わりにstate_ready.jstreeイベントを使用してください。

$(selector).on('state_ready.jstree', function () {
    // open desired node
})
于 2018-09-24T16:04:06.233 に答える
1

間隔を追加する必要はありません。プラグインは、ajaxを介してロードしているノードにクラスを設定します。

.one("reselect.jstree", function (evt, data) {
        if ($("#MYTREEID").find(".jstree-loading").length == 0) {
            alert('my ajax tree is done loading");
        }
    })
于 2013-09-24T14:09:38.670 に答える
0

解決策が見つからなかったので、現在のバージョンのJSTree（3.3.7）で機能しています。ここで、自分の作業アプローチを公開します。

まず、select_nodeにバインドし、ノードを選択するたびにjstreeに親を開くように指示します。

var strIdentifierJsTree  = "#your-whatever-id-to-jstree";
var strNode2Select = "#your-whatever-id-to-your-node-which-parents-has-to-be-showed";

$( strIdentifierJsTree ).on("select_node.jstree", function (e, data) {
       $(strIdentifierJsTree).jstree(true).open_node( data.node.parent );
});

次に、load-Functionにバインドします。

$( strIdentifierJsTree ).bind('loaded.jstree', function(e, data) {
       $(strIdentifierJsTree).jstree(true).select_node( strNode2Select );
});

これで、JSTreeの初期化後に（完全にロードされたときに）ノードが選択され、ネストの深さに関係なく、すべての親が開かれます。他の回答で述べたように、単一のオープンノードアプローチは私にはうまくいきませんでした。

于 2021-06-30T22:57:30.613 に答える