Javascript 用AJAX中获得的JSON数据填充JSTree

我试图用从服务（使用ajax调用）获取的JSON数据填充JSTree。但是，我在jquery.jstree.js文件中得到了一个“既不提供数据也不提供ajax设置错误”。因此，JSTree只显示一个正在加载的gif

AJAX代码（编辑后尝试将json设置为局部变量测试，然后返回测试）

JSTree代码

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

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

经过一些调试，我发现当传递给createJSTrees方法时，jsonData是未定义的。我是否在Ajax代码中正确地检索了该数据？

---

提前感谢

我以前没有测试过您的方法，您直接向json_数据插件提供数据参数，因此我无法提供此场景的答案

但是，由于您使用AJAX调用来获取数据，您不能将AJAX调用提供给JSTree并让它自己处理调用吗？下面是我如何在代码中配置AJAX调用的：

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

---

jsonData未定义，因为getJSONData（）不返回值。除非为getJSONData（）分配一个本地变量，该变量在$.ajax调用完成后返回，否则不能依赖$.ajax成功处理程序的返回值。但是您需要这样的东西，它还有异步的好处：

<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>

$（函数（）{
$.ajax({
async:true，
键入：“获取”，
url:“/JavaTestService/rs/TestService/MyFirstTestService？languageCode=en_US&version=2”，
数据类型：“json”，
成功：函数（json）{
createJSTrees（json）；
},    
错误：函数（xhr、ajaxOptions、thrownError）{
警报（xhr.状态）；
警报（thrownError）；
}
});
});    
函数createJSTrees（jsonData）{
$（“#供应商结果”）.jstree({
“json_数据”：{
“数据”：jsonData
},
“插件”：[“主题”、“json_数据”、“ui”]
});
}    

当我尝试这种方法时，会出现以下错误：POST 405（不允许使用方法）。你能把上面代码中的type参数从'POST'改为'GET'吗？这应该能奏效。我已经相应地更新了代码。我想可能就是这样。现在没有控制台错误，但是我的JSTree是完全空的。当我尝试下面Adam描述的方法时，情况也是如此。不知怎的，我只是没有得到正确的数据。如果您知道上面的代码是可靠的，我将继续在我的应用程序的其他地方寻找原因。当您自己执行函数getJSONData时，您是否获得了方法成功（json）的预期结果？你能把你得到的结果加在这里吗？可能返回的对象与JSTree的对象结构（在中定义）不匹配，与我在上面的文章中对AJAX代码所做的当前编辑不匹配，jsonData仍然没有定义。但是，我发现我从服务中获得的json数据与jstree对象结构不一致。我将修复我的服务并再次尝试上述方法。谢谢你的帮助。我已经实现了上述方法，但是我的JSTree是完全空的（甚至不是加载gif）。我也没有得到任何控制台错误，所以我猜json数据可能是空的？但情况不应该是这样，因为我已经测试了服务。我不熟悉jsTree，但上面的代码将确保使用服务的JSON响应调用createJSTrees（jsonData）。执行该函数时jsonData是什么样子的？在将局部变量添加到getJSONData（）后，jsonData仍然未定义。经过编辑的AJAX代码在我的主要帖子中。在AJAX调用之后，变量测试也是未定义的。局部变量方法用于async:false方法（您只需在编辑的帖子中设置async:true）。您需要像使用async:true方法一样使用我的代码。明白了，谢谢。这似乎是可行的，但现在我只需要修改我的服务，以返回根据jstree文档格式化的json数据。

<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>