jsTree：progressive_render與陣列中的ajax/render節點

這是關於。我一直在爲此苦苦掙扎了一段時間，但只是意識到不是（本地）可能做到的，所以我想到了下面解決方案來解決我的問題（這是行不通的）。jsTree：progressive_render與陣列中的ajax/render節點

我有一棵樹，它使用json_data插件和ajax。一旦打開特定節點，服務器的結果就是包含超過1000個json節點的數組。響應是相當快的，但渲染本身需要一段時間（用戶體驗是，他得到了惱人的「腳本不響應 - 停止腳本/繼續」。消息

我想過，是限制發送的結果該解決方案從回服務器爲較小的數字（比如200），並使用一些「節目更」標籤（或者使用jQuery滾動事件），以然而提取下一200 ，使用在每個這些節點的出現jstree.create 非常緩慢然後我注意到這個線程on the jsTree google group 其中Ivan建議可以使用一次創建所有節點parse_json函數 - 這不適合我。

的什麼，我試圖做一個簡短的代碼片段：（點擊「顯示更多」標籤時）：

$.ajax({ 
    // send data to server in order to get the relevant json back 
    }(), 
    success : function (r) { 
      var parent_node = data.inst._get_parent(data.rslt.obj); 
      var id = parent_node.attr("id"); 
      $("#root_tree").jstree("_parse_json", r, parent_node); 
      $("#root_tree").jstree("clean_node", parent_node, false); 
      } 
    });

上面的例子不呈現JSON，並增加了孩子父節點爲。

我將高度讚賞任何其它方法或如果任何人能指出什麼我做錯了。同樣，使用：

$.each(r, function(i, node) { 
     var id = parent_node.attr("id"); 
     $("#root_tree").jstree("create", "#"+id, "last", node, false, true); 
});

的工作，但非常非常緩慢（慢於渲染的所有1000個節點在一起）。

感謝

來源

2012-02-23 Amir

從什麼伊萬認爲，這聽起來像'_parse_json' *回報* DOM樹可以追加（ 'parent_node.append（結果）'？）。你有沒有潛入JSON_DATA插件源，看看該方法實際上做了什麼？ – kamranicus 2012-03-27 20:56:00

好了，我的使用是有點過。

我最終什麼事做呼籲樹視圖的功能，而不是聽事件：

var ref = parent_node.attr("id"); 
$.each(data, function(i, jsonNode) { 
     var node = inst._parse_json(jsonNode); 
     node.insertInside(ref); 
});

來源

2012-06-30 16:04:57 Amir

這是我有我的樹設置和我有超過幾百個節點，它就像一個魅力。我在IE6/7中確實有一個非常微小的性能問題，但是在其他地方都是冠軍。

$('#serverTree').bind("select_node.jstree", function (e, data) { 
     var url = data.rslt.obj.children("a:eq(0)").attr("href"); 
     if (url === "hasChild") { 
      data.inst.toggle_node(data.rslt.obj); 
     } 
     else { 
      //Do something when the leaf nodes are clicked 
     } 

    }).jstree({ 
     "themes": { "theme": "apple", "dots": false, "icons": false }, 
     "json_data": { 
      "ajax": { 
       "url": "/Home/GetNodes", 
       "data": function (n) { 
        return { id: n.attr ? n.attr("id") : 0 }; 
       } 
      } 
     }, 
     "plugins": ["themes", "json_data", "ui"] 
    });

這是我的JSON從服務器回來的樣子：

[{"data":{"title":"Node1","attr":{"id":null,"href":"hasChild"}}, 
"attr":{"id":"Node1","href":null},"state":"closed"}]

來源

2012-04-13 16:51:29

謝謝，但這是jstree的一個非常「正常」的用法。如果您有幾千個節點並且用戶體驗相當糟糕，它會變得非常緩慢。不幸的是我不再在這個項目上工作，但我認爲這樣做的正確方式應該是這樣的：'$（this）._ parse_json（<節點數組>，）'。 – Amir 2012-04-14 07:19:09

jsTree：progressive_render與陣列中的ajax/render節點

回答

相關問題