Wypełnianie JSTree danymi JSON uzyskanymi w AJAX

Question

Próbuję wypełnić JSTree danymi JSON, które otrzymuję z usługi (która jest nazywana przy użyciu ajax). Jednak otrzymuję komunikat o błędzie "Ani dane, ani ustawienia ajax nie jest dostarczany" w pliku jquery.jstree.js. Z tego powodu JSTree wyświetla tylko ładujący się gif.

kod AJAX (editted spróbować ustawienia json do testu lokalnej zmiennej, a następnie powrócić testu)

function getJSONData() { 
    var test; 
    $ 
      .ajax({ 
       async : true, 
       type : "GET", 
       url : "/JavaTestService/rs/TestService/MyFirstTestService?languageCode=en_US&version=2", 
       dataType : "json", 

       success : function(json) { 
        test = json; 
       }, 

       error : function(xhr, ajaxOptions, thrownError) { 
        alert(xhr.status); 
        alert(thrownError); 
        test = "error"; 
       } 
      }); 
    return test; 
} 

kod JSTree

var jsonData = getJSONData(); 
createJSTrees(jsonData); 

function createJSTrees(jsonData) { 
     $("#supplierResults").jstree({ 
      "json_data" : { 
       "data" : jsonData 
      }, 
      "plugins" : [ "themes", "json_data", "ui" ] 
     }); 

Po pewnym debugowania, odkryłem, że jsonData jest niezdefiniowana po przekazaniu do metody createJSTrees. Czy poprawnie odczytuję te dane w kodzie Ajax? Z góry dziękuję

Answer 1

Nie przetestowałem twojego podejścia wcześniej, gdzie podasz parametr danych bezpośrednio do wtyczki json_data, więc nie będę w stanie dostarczyć odpowiedzi na ten scenariusz.

Ponieważ jednak używasz wywołania AJAX do pobierania danych, nie możesz dostarczyć wywołania AJAX do JSTree i pozwolić mu samodzielnie obsłużyć wywołanie? Oto jak mam skonfigurowany wywołania AJAX w moim kodu:

 (...) 
     'json_data': { 
      'ajax': { 
       'url': myURL, 
       'type': 'GET', 
       'data': function(node) { 
        return { 
         'nodeId': node.attr ? node.attr("id") : '' 
        }; 
       } 
      }, 
      'progressive_render': true, 
      'progressive_unload': false 
     }, 
     (...) 

Answer 2

jsonData jest nieokreślona, ​​ponieważ getJSONData() nie zwraca wartości. Nie można polegać na wartości zwracanej z procedury obsługi sukcesu $ .ajax, chyba że przypiszesz zmienną local do getJSONData(), która zostanie zwrócona po zakończeniu wywołania $ .ajax. Ale chcesz czegoś takiego, co również ma tę zaletę, że jest asynchroniczne:

<script type="text/javascript">  

$(function() { 
    $.ajax({ 
     async : true, 
     type : "GET", 
     url : "/JavaTestService/rs/TestService/MyFirstTestService?languageCode=en_US&version=2", 
     dataType : "json",  

     success : function(json) { 
      createJSTrees(json); 
     },  

     error : function(xhr, ajaxOptions, thrownError) { 
      alert(xhr.status); 
      alert(thrownError); 
     } 
    }); 
});  

function createJSTrees(jsonData) { 
    $("#supplierResults").jstree({ 
     "json_data" : { 
      "data" : jsonData 
     }, 
     "plugins" : [ "themes", "json_data", "ui" ] 
    }); 
}  

</script>