我需要从jQuery中的.ajax函数中的“成功”返回

时间:2012-10-21 18:54:33

标签: jquery

我有一个基于我从AJAX调用收到的JSON数据填充的JsTree。这是AJAX调用。

function sendQuery(){
    $.ajax({
        context: this,
        url: 'http://localhost:8080/testMain',
        type: 'GET',
        dataType: 'text',
        success: function(data) {
                       // ^^^^ Need for sendQuery() to return DATA 
                },
        error:  function (xhr, ajaxOptions, thrownError){    
                    alert('Error xhr : ' + xhr.status);    
                    alert('Error thrown error: ' + thrownError);    
                }
    }); 
}

我知道这里存在范围问题。在JavaScript中,变量是根据声明函数定义的。我只是不知道如何从sendQuery()返回,然后我将其用作另一个函数的参数,该函数将解析JSON,这是另一个为树的阶段的参数。有点在发条中对这件作品感到沮丧,并没有像我在Java中习惯的那样简单。非常感谢你的帮助,如果它有效,那么病态肯定会接受。干杯

编辑#1:好的,基于答案,我相信如果我以这种方式更改我的代码,它将允许数据退出.ajax函数。还有一个问题是如何让它回到程序流程中。

function sendQuery(){
    $.ajax({
        context: this,
        url: 'http://localhost:8080/testMain',
        type: 'GET',
        dataType: 'text',
        success: getJson,
        error:  function (xhr, ajaxOptions, thrownError){    
            alert('Error xhr : ' + xhr.status);    
            alert('Error thrown error: ' + thrownError);    
        }
    }); 
}

function getJson(data){
    alert("Transmission Success.");
    alert(data);
    var obj = $.parseJSON(data);
    alert("Parsing JSON Success.");
    var apples = obj.apples;
    alert(apples);
    return apples;
}

好的,现在我如何将APPLES变量放入调用链中,该调用链将为树的数据进行分级?

我需要将APPLES变量提供给将处理数据的函数。

编辑#2使用回调:

我花了一秒钟的时间来回避一个回调的想法。这就是我能用它做的事情。

这是我的原始树代码,它调用一系列函数来执行不同的操作,但最终以树将接受的形式获取数据。

$(function () {     
    $("#client_tree").jstree({
        "json_data": {"data": attachTree(stageTreeData(getJson(sendQuery())))}, 
        "plugins" : [ "themes", "json_data", "ui" ]
    }).bind("select_node.jstree", function (e, data) { 
        var msg = data.rslt.obj.attr("id");
        alert(msg);
    });
});

我目前正在尝试通过Ajax获取数据,在sendQuery()方法中然后从数据等返回...]

我稍微改了一下,现在我不调用sendQuery(),jQuery调用它。

$(function (){
    $.ajax({
        context: this,
        url: 'http://localhost:8080/testMain',
        type: 'GET',
        dataType: 'text',
        success: loadTree,
        error:  function (xhr, ajaxOptions, thrownError){    
            alert('Error xhr : ' + xhr.status);    
            alert('Error thrown error: ' + thrownError);    
        }
    });
});

还改变了我的树加载代码......

function loadTree(data){
    $("#client_tree").jstree({
        "json_data": {"data": attachTree(stageTreeData(getJson(data)))},    
        "plugins" : [ "themes", "json_data", "ui" ]
    }).bind("select_node.jstree", function (e, data) { 
        var msg = data.rslt.obj.attr("id");
        alert(msg);
    });

}

我没有错误,没有例外,树已填充。

谢谢大家的帮助!

编辑#3修复一些小问题:

已移至Alert() call in jQuery not displaying, called from within a JsTree

4 个答案:

答案 0 :(得分:3)

不,你不需要那个。

您需要的是使用数据。

但是你不能从sendQuery返回它们,因为调用是异步的,这意味着数据只有在sendQuery返回后才可用。

解决方案是为您的sendQuery函数提供一个回调函数,该函数将在数据可用时执行您想要执行的操作:

function sendQuery(callback){
   ...
   success: callback,
   ...
}

...
sendQuery(function(data){
    // do things with data
});

答案 1 :(得分:2)

您尝试做的问题是ajax调用是异步的。在您从服务器获得响应之前,sendQuery函数将返回,控制流将继续。

使用它的方法是使用回调。当您从服务器获得响应时,您传递给success()的函数将被调用。基本上,您需要该功能来从中断处获取处理管道。您希望该函数将响应解析为json,“树的阶段”等等。

您需要将调用此函数的函数分离为调用之前发生的函数,然后将调用之后发生的“其他所有内容”分开。 “其他一切”就是你在成功回调中想要的东西。

示例(对谁调用此函数做出一些假设)

function doQueryAndParseData(){  //This is the function that calls doQuery
   prepare_something();
   //You pass this in as a callback, since it can only happen once you have data
   sendQuery(function(data){     
       parsed_data = JSON.parse(data);  //This is where you do your work
       //Put parsed data into dom somehow
   }
   return; //This function will return before the data gets back, but when the server responds the data will get parsed and put into the tree
}

function sendQuery(callback){
    $.ajax({
        context: this,
        url: 'http://localhost:8080/testMain',
        type: 'GET',
        dataType: 'text',
        success: callback,
        error:  function (xhr, ajaxOptions, thrownError){    
                    alert('Error xhr : ' + xhr.status);    
                    alert('Error thrown error: ' + thrownError);    
                }
    }); 
}    

答案 2 :(得分:1)

您需要在AJAX成功中使用数据。可以使用另一个函数,因为此代码显示

   function sendQuery(){
        $.ajax({
            context: this,
            url: 'http://localhost:8080/testMain',
            type: 'GET',
            dataType: 'text',
            success: loadTree,

            error:  function (xhr, ajaxOptions, thrownError){    
                        alert('Error xhr : ' + xhr.status);    
                        alert('Error thrown error: ' + thrownError);    
                    }
        }); 
    }


function loadTree( data){
   /* do something with data returned from ajax*/

}

答案 3 :(得分:-2)

function sendQuery(){
    var val;
    $.ajax({
        context: this,
        url: 'http://localhost:8080/testMain',
        type: 'GET',
        async: false,
        dataType: 'text',
        success: function(data) {
                       val = data;
                },
        error:  function (xhr, ajaxOptions, thrownError){    
                    alert('Error xhr : ' + xhr.status);    
                    alert('Error thrown error: ' + thrownError);    
                }
    }); 
    return val;
}