jQuery 使用在 AJAX 中获得的 JSON 数据填充 JSTree
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16922984/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Populating a JSTree with JSON data obtained in AJAX
提问by Hunter Hodnett
I'm trying to populate a JSTree with JSON data that I'm obtaining from a service (which is called using ajax). However, I am getting a "Neither data nor ajax settings supplied error" in the jquery.jstree.js file. Because of this the JSTree just displays a loading gif.
我正在尝试使用从服务（使用 ajax 调用）获取的 JSON 数据填充 JSTree。但是，我在 jquery.jstree.js 文件中收到“既没有提供数据也没有提供 ajax 设置的错误”。因此，JSTree 只显示加载 gif。
AJAX code(editted to try setting json to local variable test, then return test)
AJAX 代码（编辑以尝试将 json 设置为局部变量测试，然后返回测试）
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;
}
JSTree code
JSTree 代码
var jsonData = getJSONData();
createJSTrees(jsonData);
function createJSTrees(jsonData) {
$("#supplierResults").jstree({
"json_data" : {
"data" : jsonData
},
"plugins" : [ "themes", "json_data", "ui" ]
});
After some debugging, I've found that jsonData is undefined when passed to the createJSTrees method. Am I retrieving that data correctly in the Ajax code? Thanks in advance
经过一些调试，我发现 jsonData 在传递给 createJSTrees 方法时是未定义的。我是否在 Ajax 代码中正确检索了该数据？提前致谢
采纳答案by vincentks
I have not tested your approach before, where you supply the data parameter directly to the json_data plugin, so I won't be able to supply an answer to this scenario.
我之前没有测试过你的方法，你直接将 data 参数提供给 json_data 插件，所以我无法提供这个场景的答案。
However, since you are using an AJAX call to get the data, can't you supply the AJAX call to JSTree and let it handle the call on its own? Here's how I've configured the AJAX call in my code:
但是，既然您正在使用 AJAX 调用来获取数据，那么您不能向 JSTree 提供 AJAX 调用并让它自己处理调用吗？以下是我在代码中配置 AJAX 调用的方式：
(...)
'json_data': {
'ajax': {
'url': myURL,
'type': 'GET',
'data': function(node) {
return {
'nodeId': node.attr ? node.attr("id") : ''
};
}
},
'progressive_render': true,
'progressive_unload': false
},
(...)
回答by Adam
jsonData is undefined because getJSONData() doesn't return a value. You can't rely on the return value from your $.ajax success handler unless you assign a variable local to getJSONData() that gets returned after the $.ajax call completes. But you want something like this, which also has the benefit of being asynchronous:
jsonData 未定义，因为 getJSONData() 不返回值。您不能依赖 $.ajax 成功处理程序的返回值，除非您为 getJSONData() 分配一个 local 变量，该变量在 $.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>
