How to return value when AJAX request is succeeded

Question

   function ajaxRefresh(actionUrl) {
        $.ajax({
        url: actionUrl,
        success: function() {
             return true;
        }});
        return false;
    }

The function anyway returns false even when a request is succeeded, becouse the request is asynchronous. How I can return true when request is succeeded?

Answer 1

You should set parameter async to false. Try this code:

function ajaxRefresh(actionUrl) {
    var succeed = false;

    $.ajax({
    async: false,
    url: actionUrl,
    success: function() {
         succeed = true;
    }});

    return succeed;
}

Answer 2

You can't return "true" until the ajax requests has not finished because it's asynchron as you mentioned. So the function is leaved before the ajax request has finished.

Solution 1

function ajaxRefresh(actionUrl, successCallback) {
    $.ajax({
       url: actionUrl,
       success: successcallback
    });
}

But there's a workaround: Just add a callback parameter to the function. This function will be executed when the request has finished.

Solution 2

You can return a jquery deferred.

function ajaxRefresh(actionUrl, successCallback) {
    return $.ajax({
       url: actionUrl
    });
}

Now you can use the function like:

function otherFunction()
{
     ajaxRefresh().success(function() {
        //The ajax refresh succeeded!
     }).error(function() {
        //There was an error!
     });
}

For more information about jquery deferreds look at http://www.erichynds.com/jquery/using-deferreds-in-jquery/.

Answer 3

You can refactor your code a little bit so that your success callback triggers the next operation that depends on the true/false result. For example, if you currently have something like:

function main() {
  // some code

  if (ajaxRefresh(url)) {
    // do something
  }
}

You would change that to something like:

function main() {
  // some code

  ajaxRefresh(url);
}

function doSomething(successFlag) {
  if (successFlag) {
    // do something
  }
}

function ajaxRefresh(actionUrl) {
  $.ajax({
         url: actionUrl,
         success: function() {
           doSomething(true); // or false as appropriate
         }});
}

You could also put the if test into the ajax callback function instead of in the doSomething() function. Up to you.

Or you can make a synchronous request, and figure out the ajaxRefresh() function's return value after the request is done. I would not recommend that for most purposes.

Answer 4

I am a relatively newbie at this, but here is a suggested work around I came up with which eliminates the need to set asynch to false or anything like that. Just set a hidden field value with the result of the ajax call, and instead of checking return value, check the value of the hidden field for true/false (or whatever you want to put in it).

Example: function doSomething() {

    $.ajax({
        ...blah blah 
        },
        success: function(results) {
            if(results === 'true') {
                $('#hidField').val('true');
            }
            else {
                $('#hidField').val('false');
            }
        }
    });

Then somewhere else where it's required, this doSomething function is called, and instead of checking the result of the ajax call, look for the hidden field value:

doSomething();

var theResult = $('#hidField').val();

if (theResult == 'true') {

...do whatever...

}

Answer 5

function ajaxRefresh(actionUrl) {   
    bool isSucesss=false;
    $.ajax({       
        url: actionUrl,        
        success: function() {   
            isSucesss=true;     
        },
        error:function() {   
            isSucesss= false;     
        }
    });     
    return isSucesss;
}

Answer 6

Use call back functions

Callback Function Queues:-

The beforeSend, error, dataFilter, success and complete options all accept callback functions that are invoked at the appropriate times.

so, here

function ajaxRefresh(actionUrl) {
        $.ajax({
        url: actionUrl,
        success: function() {
             return true;
        }
        error:function(){
             return false;
        }
     });        
    }

You can get more details here

http://api.jquery.com/jQuery.ajax/