jsTree: async ładowanie

Question

Próbuję użyć tej wtyczki jQuery (jsTree) w jednym z mojego projektu.
Wszystkie inne, które znalazłem, nie zostały ostatnio zaktualizowane.
W każdym razie używam tej wtyczki do załadowania struktury folderów, ale chciałbym wykonać tę operację asynchroniczną . Przykłady znalezione na ich stronie (zwane asynchronicznymi) są absurdalne. Próbowałem sprawdzić w Internecie, ale wygląda na to, że większość ludzi ładuje całe drzewo. Chciałbym załadować oddział na każdym kliknięciu jednego węzła. Używam JSON.

Dziękuję z góry

Answer 1

Używam tego z jsTree w jQuery 1.4 w tej chwili, oto przykład, to bardzo nieskompresowany aby uczynić go nieco wyraźniej:

$("#QuickNav").tree({ 
    data: { 
    async: true, 
    type: "json", 
    opts: { 
     method: "POST", 
     url: rootPath + "QuickNav" 
    } 
    }, 
    callback: { 
    beforedata: function(NODE, TREE_OBJ) { 
     return $(NODE).attr("id") === "" ? 
     { id: $(NODE).find("a:first").attr("id")} : 
     { id: $(NODE).attr("id") || 0 }; 
    }, 
    onchange: function(NODE) { 
     document.location.href = $(NODE).children("a:first").attr("href"); 
    } 
    } 
}); 

Próbkę JSON wracam z tego adresu URL:

[{ 
    "data": { 
     "title": "Title (<b link='/Thing/200' class='gtp'>Go to Page</b>)", 
     "attributes": { 
      "href": "#", 
      "id": "200" 
     } 
    }, 
    "state": "closed" 
}] 

id nie jest jedyną rzeczą, która zostanie przekazana do moich usług internetowych metody wywołania zwrotne, w wyniku JSON tak zwracane:

[{ 
    "data": { 
     "title": "Sites", 
     "attributes": { 
      "href": "#", 
      "class": "TreeTitle" 
     } 
    }, 
    "state": "open", 
    "children": [ 
     { 
      "data": { 
       "title": "00001 - Test Thing", 
       "type": "link", 
       "attributes": { 
        "href": "/Site/39063", 
        "class": "TL" 
       } 
      } 
     }, 
     { 
      "data": { 
       "title": "00002 - Test Thing 2", 
       "type": "link", 
       "attributes": { 
        "href": "/Site/39069", 
        "class": "TL" 
       } 
      } 
     } 
    ] 
}]