如何从使用jQuery ajax调用的函数返回值?

时间:2012-01-11 17:21:32

标签: asp.net jquery

我有以下Javascript函数调用Asp.Net WebMethod,如果用户名已存在则返回true,否则返回false。 以下内容将在警告框中给出正确答案,但如果我更改了 alert(result.d)返回result.d 函数的结果总是未定义的。 如何根据WebMethod的响应获取包含Ajax调用的函数返回值?

function doesEnteredUserExist() {
        var valFromUsernameBox = $("#txtUserName").val();
        var jsonObj = '{username: "' + valFromUsernameBox + '"}'; 

        $.ajax({
        type: 'POST',
        contentType: 'application/json; charset=utf-8',
        data: jsonObj,
        dataType: 'json',
        async: false,
        url: 'AddNewUser.aspx/IsUserNameValid',
        success: function (result) {
            alert(result.d);
        },
        error: function (err) {
            alert(err);
        }
    });
}

8 个答案:

答案 0 :(得分:2)

需要注意的是ajax功能非阻止。您指定了两个回调函数,一个用于success,另一个用于error,其中一个函数将在基础请求完成时执行。

您的doesEnteredUserExist不会等待ajax调用完成,因此该函数的返回值为undefined

根据您的通话结果继续执行的正确方法是将您的功能分解为单独的功能,并从success功能中调用该功能。

答案 1 :(得分:1)

Ajax是异步的,所以一旦函数“doEnteredUserExist”返回,ajax调用还没有完成。然后在成功回调中你有了价值。从那里你应该继续你的代码并向用户显示信息。

答案 2 :(得分:0)

result.d的值存储在变量中,然后将其用于您想要的任何内容。

改变这个:

success: function (result) {
        alert(result.d);
    },

到此:

success: function (result) {
        var resultString = result.d;
    },

现在,只要您需要result.d,就可以使用变量resultString。基本上,ajax调用是唯一可以调用你想要返回值的函数,因此你需要在调用函数时存储该值。

答案 3 :(得分:0)

也许给这个打击      function onSucess(data){             警报(data.d);         }

function doesEnteredUserExist() {
    var valFromUsernameBox = $("#txtUserName").val();
    var jsonObj = '{username: "' + valFromUsernameBox + '"}'; 

    $.ajax({
    type: 'POST',
    contentType: 'application/json; charset=utf-8',
    data: jsonObj,
    dataType: 'json',
    async: false,
    url: 'AddNewUser.aspx/IsUserNameValid',
    success: onSucess,
    error: function (err) {
        alert(err);
    }
});   
}

答案 4 :(得分:0)

success回调函数中,如果return某个值,则不会为其父函数设置return值。在这种情况下,父函数是$.ajax,它总是返回一个jqXHR延迟对象。

如果您使用的是jQuery 1.5或更高版本,则可以使用延迟。我们的想法是保存从AJAX请求返回的jqXHR对象,并在返回它的值之前等待它完成:

var jqXHR = $.ajax({...});

$.when(jqXHR).then(function (result) {
    return result.d
});

$.when()的文档:http://api.jquery.com/deferred.when

执行此操作的一个示例是从函数返回jqXHR对象,然后等待AJAX​​请求在函数外部解析:

function doesEnteredUserExist() {
    return $.ajax({...});
}
$.when(doesEnteredUserExist).then(function (result) {
    //you can access result.d here
});

答案 5 :(得分:0)

我猜你正在尝试设置result.d,这超出了调用的范围,这就是为什么alert(result.d)作为其范围内的原因。

我可能会得到错误的结果,您可以使用全局变量(不推荐),在ajax返回中设置,然后您可以从函数中读取。

我可能需要更多信息或清楚了解您尝试实现的目标,因为我在几个方面阅读了这个问题。

我通常这样做(没有测试过这个):

function ajaxLoad(callback)
$.ajax({
        type: 'POST',
        async: true,
        url: 'url.aspx',
        data: d,
        cache: false,
        contentType: 'application/json',
        dataType: 'json',
        error: function (xmlHttpRequest, textStatus, errorThrown) {
    //error stuff
        },
        success: function (data) {
           if (typeof callback == 'function') { [callback(data)]; }
        }
    });

}

function callback(data)
{
    alert(data);
}

使用调用函数     ajaxLoad( '回调');

类似的东西!

答案 6 :(得分:0)

这似乎是$.Deferred对象使用

的一个很好的例子

这个想法很简单(真的,我承诺,:)看到代码上的步骤)

  1. 创建新的延迟对象
  2. 拨打你的ajax电话。如果结果为假,您将拒绝延期,否则您将解决它(您也可以在error ajax回调中拒绝它)
  3. 回复承诺
  4. 使用.when()帮助程序检查承诺的状态。
  5. 我创建了一个小提琴,它在响应中随机返回true或false

    function checkUserExist() {
        var dfd = $.Deferred();  /* step 1 */
    
        $.ajax({
            url: "/echo/json/",
            data: {
                "json": JSON.stringify({d: (Math.random() < 0.5) })
            },
            type: "POST",
            success: function (data) {
                console.log("result (inside ajax callback) ", data.d);
                if (!data.d) { dfd.reject() } else { dfd.resolve(); } /* step 2 */
            },
            error : ...
        });
    
        /* step 3 */         
        return dfd.promise();
    
    }
    
    $.when(checkUserExist())  /* step 4 */
        .fail(function() { console.log("user don't exist (inside fail)"); })
        .done(function() { console.log("user already exist (inside done)"); })
    

    小提琴:http://jsfiddle.net/Gh9cN/

    (注意:我已经更改了一些内部细节,以使其适用于jsfiddle)

答案 7 :(得分:0)

正如@timing所提到的,当从函数返回值时,ajax调用未完成,所以每次得到undefined时。

这不是问题的解决方案,但是您可以尝试显示它的另一种方法是返回值,只需使用返回的文本更新某些元素(如div)的innerHTML。我的意思是:

function doesEnteredUserExist() {
    var valFromUsernameBox = $("#txtUserName").val();
    var jsonObj = '{username: "' + valFromUsernameBox + '"}'; 

    $.ajax({
    type: 'POST',
    contentType: 'application/json; charset=utf-8',
    data: jsonObj,
    dataType: 'json',
    async: false,
    url: 'AddNewUser.aspx/IsUserNameValid',
    success: function (result) {
        //alert(result.d); 
       if(result.d==true){  //Just a check for the value whether true or 1 etc..
       $("#notifications").html('Username Already Exists'); // Have a div where you can display the message (named it notifications here) , update the notifications div text to notify the user
       }else{
          $("#notifications").html('Username is Available');
       }
    },
    error: function (err) {
        alert(err);
    }
});
}