javascript variable equal to value from function

Question

Possible Duplicate:
How to return AJAX response Text?
How to return the response from an AJAX call from a function?

So I have a javascript function where I'm doing an AJAX call to see if the user is online or offline. It looks something like this.

function onlineStatus(){

    $.ajax({
        url: "assets/ajax/online-offline.php",
        cache: false,
        success: function(html){
          return html;
        }
    }); 
}

I would like to assign the value from this function as a variable that I can then use.

Something like this.

var test = onlineStatus();

if (test == "true")
   alert("online");
else
   alert("offline");

Is this possible? I must be doing something wrong, but can't figure out how to achieve this result. Thanks

// Edit: Thanks for your help everyone, sorry, didn't realize it may have been a duplicate question. I wasn't sure what to search for initially, so I didn't see anything related.

You cannot directly do this because AJAX is asynchronous by default. Either you have to specify the `async: false` option to `$.ajax` or you need another way of doing this. — marekful, Jan 11 '13 at 17:38

score 6 · Accepted Answer · answered Jan 11 '13 at 17:38

$.ajax is asynchronous so you can't return anything from onlineStatus, you need to pass it a callback function that can be called when the ajax call completes.

function onlineStatus(callback){

    $.ajax({
        url: "assets/ajax/online-offline.php",
        cache: false,
        success: callback
    }); 
}

onlineStatus(function(test) {
    if (test == "true")
       alert("online");
    else
       alert("offline");
});

score 4 · Answer 2 · answered Jan 11 '13 at 17:38

Since calls happen asynchronously, you'll have to pass a callback function into onlineStatus. Something like:

function onlineStatus(callback){

    $.ajax({
        url: "assets/ajax/online-offline.php",
        cache: false,
        success: function(html){
          callback(html);
        }
    }); 
}

And then call it with:

onlineStatus(function (html)
   {
      // Do stuff with the status
   });

Matt Burland · Answer 3 · 2013-01-11T17:56:34.960

1

AJAX is asynchronous, that's what the A stands for. You need pass a callback.

For example:

function onlineStatus(callback){

    $.ajax({
        url: "assets/ajax/online-offline.php",
        cache: false,
        success: callback
    }); 
}

onlineStatus(function(data) { 
    if (data == "true") { 
        alert "online"; 
    }
    else {
        alert "offline";
    }
}

edited Jan 11 '13 at 17:56

answered Jan 11 '13 at 17:37

Matt Burland

44,552
18
99
171

@MikeChristensen: Thanks. A simple typo, now fixed. – Matt Burland Jan 11 '13 at 17:57

score 1 · Answer 4 · answered Jan 11 '13 at 17:48

You can simple use a deferred object.

function onlineStatus(){

    var request = $.ajax({
        url: "assets/ajax/online-offline.php",
        cache: false
    }); 

    return request;
}



var test = onlineStatus();
test.done(function(html) {
    if (html)
       alert("online");
    else
       alert("offline");
});

$.ajax returns a jqXHR, so you can use .done:

jqXHR.done(function(data, textStatus, jqXHR) {});

An alternative construct to the success callback option, the .done() method replaces the deprecated

score 0 · Answer 5 · answered Jan 11 '13 at 17:38

The $.ajax method is asynchronous so you need to handle its return values in the callback.

function onlineStatus(){

    $.ajax({
        url: "assets/ajax/online-offline.php",
        cache: false,
        success: function(html){
            if (html == "true")
                alert("online");
            else
                alert("offline");
        }
    }); 
}

score 0 · Answer 6 · answered Jan 11 '13 at 17:39

you can do like this.......but it is not a good method because synchronous request by ajax makes your code slow.......

function onlineStatus(){
var data;
    $.ajax({
        url: "assets/ajax/online-offline.php",
        cache: false,
        async:false,
        success: function(html){
           data = html;
        }
    }); 

return data;
}

or
if you only want to dispaly the alert box then...

function onlineStatus(){

    $.ajax({
        url: "assets/ajax/online-offline.php",
        cache: false,
        success: function(html){
           if (html== "true")
            alert("online");
            else
            alert("offline");
        }
    }); 

return data;
}

Weird, never knew jQuery had a synchronous mode.. That's asking for trouble. — Mike Christensen, Jan 11 '13 at 17:43
due to async= false, "data" would get true/false from the "html" so function would as a result returns it...."synchronously" — sourcecode, Jan 11 '13 at 17:44

score 0 · Answer 7 · answered Jan 11 '13 at 17:47

jQuery ajax call is an asynchronous call. You will have to wait to get the results before you can use them for showing the alert.

    var isOnline = false;
    checkOnlineStatus();

    function checkOnlineStatus(){

        $.ajax({
            url: "assets/ajax/online-offline.php",
            cache: false,
            success: callback
            }
        }); 

    }
    function callback(html){
        isOnline = (html == "online");
        showAlert();
    }
    function showAlert(){
        if (isOnline == "true")
           alert("online");
        else
           alert("offline");
    }

javascript variable equal to value from function

7 Answers7