Chibuzo
Chibuzo

Reputation: 6117

I don't understand how this javascript function executes

When I run the following codes, the alert popup displays undefined. I thought it would return either true or false instead. Please can someone explain how the checkLoginStatus() function excutes. Thanks.

function checkLoginStatus() {
    $.get("func.php", {op:'login_status', r:Math.random()}, function(data) {
        if (data == "Yes") {
            showSalesView();
            return true;
        } else {
            loginView();
            return false;
        }   
    });
}   

alert(checkLoginStatus());

Upvotes: 1

Views: 155

Answers (4)

Kyle Trauberman
Kyle Trauberman

Reputation: 25684

The returned bool is being returned by the $.get functions callback, not checkLoginStatus.

function checkLoginStatus() {
    $.get("func.php", {op:'login_status', r:Math.random()}, 

        // Start Callback Function
        function(data) {
            if (data == "Yes") {
                showSalesView();
                return true;
            } else {
                loginView();
                return false;
            } 
        // End Callback Function

    });
}

Upvotes: 1

almog.ori
almog.ori

Reputation: 7889

what you are seeing is the undefined (void) return from the .get() function, notice carefully that .get function call contains another function as the third parameter ( first being the url, second being an anon object) that is the "callback" for the results of the .get function, this is called later when the results have been returned from the server.

Upvotes: 1

Guffa
Guffa

Reputation: 700362

The AJAX call is asynchronous, so the function that you specify as callback will be executed when the response arrives. The code doesn't wait for the response to exit from the checkLoginStatus function.

You can use a callback method to display the result:

function checkLoginStatus(callback) {
  $.get("func.php", {op:'login_status', r:Math.random()}, function(data) {
    if (data == "Yes") {
      showSalesView();
      callback(true);
    } else {
      loginView();
      callback(false);
    }   
  });
}

checkLoginStatus(function(status){ alert(status); });

Upvotes: 1

Robert
Robert

Reputation: 21388

There's a couple things wrong.

One, you're performing an asynchronous call within the function, so by the time the call has come back, checkLoginStatus has already returned. It essentially looks like this:

function checkLoginStatus() {
    $.get("func.php", {
        op: 'login_status',
        r: Math.random()
    }, function(data) {
        if (data == "Yes") {
            showSalesView();
            return true;
        } else {
            loginView();
            return false;
        }
    });
    // return undefined
}

Second, you're returning within the callback of another function, so that return affects the return value of the callback to $.get

You want to use callbacks. So,

function checkLoginStatus(callback) {
    $.get("func.php", {
        op: 'login_status',
        r: Math.random()
    }, function(data) {
        if (data == "Yes") {
            showSalesView();
            callback(true);
        } else {
            loginView();
            callback(false);
        }
    });
}

and then

checkLoginStatus(function(result) {
    alert(result);
});

Upvotes: 7

Related Questions