AJAX异步调用 - 无法与回调返回的数据？ [英] AJAX asynchronous call -- can't return data with callback?

问题描述

我有这个code以下，我想返回数据的AJAX调用成功功能。当然，如果我做的异步：假，回到它直接我得到它，但我并不想这样做。

如果我只是运行它，喜欢它，现在，信息变量未定义（如果我这样做异步：假的，它得到的信息，所以它不是这是问题的数据内容）。

我只是不明白为什么它不工作，我用Google搜索回调函数，看来，我这样做是正确的......

 函数PUT_updateSystem（ID）{
    VAR系统= {};
    系统= getSystemInformation（名称，功能（数据）{
                                VAR系统=数据;
                                退货制度;}）;

    VAR信息= system.info;

}
//返回系统信息
功能getSystemInformation（姓名，回调）{
    $阿贾克斯（{
        键入：GET，
        网址：的getURL（）
        缓存：假的，
        数据类型：JSON，
        成功：功能（数据）{
            回调（数据）;
        }
    }）;
}
 

编辑： 改变了我的code，以我目前有

我产生jsTree与此数据，并创建JSON数据的那棵树，我做以上，但把信息变量转换成一个对象并遍历它来创建节点。这个问题是不是与树，所以我将不包括在这里。我甚至可以把这个逻辑了测试。

那么发生了什么，

1. 在页面开始加载
2. 我执行上述
3. 在信息被放入一个JavaScript对象
4. 在我遍历JavaScript对象。
5. 我收到无法读取的未定义的属性'长'的错误
6. 当我调试，我看到它跳过system.done。这是有道理的，因为它可能无法做到的。

有没有办法来等待它做些什么呢？

编辑： 提供了更多的信息。

  

//在一个名为loadinfo.js

  //返回系统信息的承诺
功能getSystemInformation（）{
    返回$阿贾克斯（{
        键入：GET，
        网址：的getURL（）// URL被定义在别处
        缓存：假的，
        数据类型：JSON
    }）;
}

//在一个名为tree.js
//我从loadinfo.js其他变量的位置，使他们能够沟通精

    $。当（getSystemInformation（），$ .Deferred（函数（延迟）{
        $（deferred.resolve）;
    }））。完成（功能（数据）{
        mapCache [系统] =数据;
        的console.log（推迟DONE！）;

$每个（mapCache [系统]，功能（指数系统）{
            VAR孩子= doDisplayChildNodes（system.name）;
            ...
                    ...
}）;
 

我在做什么在这个$。每个距离mapCache抓取数据[系统]，并开创了jstree节点。我小时候功能，做同样的事情，因为我与每个系统关联的子节点。所有这一切逻辑的工作，因为它的工作工作正常，当我有Ajax调用为异步：假 - 所以我不会发表。

我可以获得在$。每未定义的无法读取属性长度。这很奇怪，因为我有一个观察设置mapCache和装载一切后，mapCache充满了正确的价值观。我使用谷歌浏览器的调试。

解决方案

您使用了回调，但你仍然使用它同步的逻辑，而不是异步的。尝试做这种方式：

 函数PUT_updateSystem（ID）{
    VAR系统= getSystemInformation（名称）;
    system.done（功能（数据）{
        VAR信息= data.info;
        //做的东西跟`information`这里，其他地方没有。
    }）;
}
//返回系统信息的承诺
功能getSystemInformation（名字）{
    返回$阿贾克斯（{
        键入：GET，
        网址：的getURL（）
        缓存：假的，
        数据类型：JSON
    }）;
}
 

I have this code below, and I want to return the data in the success function of the ajax call. Of course, if I do async:false and return it directly I get it but I don't want to do that.

If I just run it like it is now, information variable is undefined (if I do async:false, it gets the information, so it isn't the contents of the data that is the issue).

I just don't understand why it isn't working, I googled callback functions and it appears that I am doing it right...

function PUT_updateSystem(id) {
    var system= {};
    system= getSystemInformation(name, function(data){
                                var system = data;
                                return system;});

    var information = system.info;

}
// Returns system information
function getSystemInformation(name,callback){
    $.ajax({
        type:"GET",
        url: getUrl(),
        cache: false,
        dataType: "json",
        success: function(data){
            callback(data);
        }
    });
}

EDIT: Changed my code to what I currently have

I am generating a jsTree with this data, and to create the json data for that tree I am doing the above but putting the information variable into an object and iterating over it to create nodes. The issue isn't with the tree, so I won't include that here. I can even take that logic out to test.

So what is happening,

1. Page starts loading
2. I perform the above
3. Information gets put into a javascript object
4. I iterate over the javascript object.
5. I receive an error "Cannot read property 'length' of undefined"
6. As I'm debugging, I see that it skips over system.done. This makes sense because it may not be done.

Is there a way to wait for it to be done?

EDIT: Providing more information

// IN A FILE CALLED loadinfo.js

// Returns system information promise
function getSystemInformation(){
    return $.ajax({
        type:"GET",
        url: getUrl(), // url is defined somewhere else
        cache: false,
        dataType: "json"
    });
}

// IN A FILE CALLED tree.js
// I have other variables from loadinfo.js that are here so they can communicate fine

    $.when(getSystemInformation(), $.Deferred(function(deferred) {
        $(deferred.resolve);
    })).done(function(data) {
        mapCache["system"] = data;
        console.log("defer DONE!!");

$.each(mapCache["system"], function(index, system) {
            var children = doDisplayChildNodes(system.name);
            ...
                    ...
});

What I'm doing in this $.each is just grabbing data from mapCache["system"] and creating a "jstree" node. I do a child function to do the same thing, because I have child nodes associated with each system. All of this logic worked because it work working fine when I had the ajax call as "async:false" -- so I won't post that.

I receive the Cannot read property 'length' of undefined during the $.each. Which is strange because I have a "Watch" set on mapCache and after everything is loaded, mapCache is filled with the correct values. I am using Google Chrome debugging.

解决方案

You used a callback, however you still used it with synchronous logic rather than asynchronous. Try doing it this way:

function PUT_updateSystem(id) {
    var system = getSystemInformation(name);
    system.done(function(data){
        var information = data.info;
        // do stuff with `information` here, not elsewhere.
    });
}
// Returns system information promise
function getSystemInformation(name){
    return $.ajax({
        type:"GET",
        url: getUrl(),
        cache: false,
        dataType: "json"
    });
}

这篇关于AJAX异步调用 - 无法与回调返回的数据？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！