blockUI vs ajax with async option to false

I need to call a javascript function which returns the content of an ajax call.

In order to achieve this result I set async option to false in ajax call.

function ajaxQuery(){
    var content;
    $.ajax({
        url: "blabla.html,
        async: false,
        success: function(data){
            content =   data
        }
    });
    return content;
}

Unfortunately, setting async option to false make blockUI not working properly. During the query to the server, the browser is frozen with no message.

If I set async option to true the blockUI comes to work properly but my javascript function return the value undefin开发者_开发百科ed, probably because the ajax query is not finished.

How to solve this problem in javascript function to get the content of the ajax call making blockUI working?

Thanks,

Antonio

---

You can't.

Synchronous AJAX calls will completely freeze the browser and should be avoided at all costs; there is no way around that.

Instead, you should pass the value using a callback, the same way $.ajax does.

---

Problem with this code is that data is passed to callback and so this part of code

return content;

will be excecuted some time before this one

success: function(data){
        content =   data
    }

this is cause of undefined return.

How to do then?

function contentParse(data){
    //do things with data received
}

$.ajax({
    url: "blabla.html",
    success: function(data){
        contentParse(data);
    }
});

At least this is how I do. Good luck.

---

your problem is that you are returning content at the end; instead, modify the dom in the success callback you registered(or call a function that does). You probably want to register an error callback as well that does something if the server returns other than 200.

---

show some status message of Loading... till the response is obtained.

---

disable all other control untill one operation completes