CODEWITHSUNDEEP
javascriptjquery
antonjs
antonjs

Reputation: 14318

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 undefined, 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

Upvotes: 7

Views: 7003

Answers (5)

Mohit Singh
Mohit Singh

Reputation: 6167

disable all other control untill one operation completes

Upvotes: 0

nagisa
nagisa

Reputation: 720

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.

Upvotes: 4

Amareswar
Amareswar

Reputation: 2064

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

Upvotes: 1

hvgotcodes
hvgotcodes

Reputation: 120198

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.

Upvotes: 1

SLaks
SLaks

Reputation: 887489

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.

Upvotes: 9

Related Questions