asp.net mvc - $.ajax( { async : false } ) request is still firing asynchronously?

Question

I got a little problem here guys. I'm trying to implement the following scenario:

1. A user opens the home page and sees a list of other users and clicks to add one to his friend list.
2. I issue an Ajax request to a server resource to validate if the user is logged in, if so, I issue another ajax request to another server resource to actually add it to the user's friend list.

Sounds simple? Here's what I've done: I created a function isLoggedIn that will issue the first request to the server in order to determine if the user is logged in. I issue this request using jQuery.ajax method. Here's my function looks like:

function isLoggedIn() {

    $.ajax({
    async: "false",
        type: "GET",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        url: "/isloggedin",
        success: function(jsonData) {
            alert("jsonData =" + jsonData.LoggedIn);
            return jsonData.LoggedIn;
        }
    });
}

The returned JSON is very simple, it looks like the following:

{ LoggedIn: true } or { LoggedIn : false } 

Now this method, actually works and displays the alert correctly: JsonData = true if logged in, and JsonData = false if not logged in. Up to this point there's no problem, the problem occurs when I try to call this method: I call it like so:

$(".friend_set .img").click(function() {
    debugger;
    if (isLoggedIn()) { 

        alert("alredy logged in");
        trackAsync();
        popupNum = 6;
    }
    else {
        alert("not logged in"); //always displays this message.
        popupNum = 1;
    }
    //centering with css

    centerPopup(popupNum);
    //load popup
    loadPopup(popupNum);
    return false;

});

Calling isLoggedIn always returns false, and it returns false before the ajax request finishes (because the messagejsonData = trueis displayed after the message "not logged in". I made sure that the request is **NOT** Asynchronous by statingasync: false`!

Apparently it's still working asynchronously, though. What am I missing here guys?

Answer 1

You need async:false, not async:"false". (i.e. pass boolean false, not string "false").

Edit: also with async requests you need to return a value after the call to ajax, not inside your success handler:

function isLoggedIn() {
    var isLoggedIn;
    $.ajax({
        async: false,
        // ...
        success: function(jsonData) {
            isLoggedIn = jsonData.LoggedIn
        }
    });
    return isLoggedIn 
}