Synchronous javascript call to MVC 4 Controller action

Question

I'm writing piece of code, and I need some functions to be executed sequential, I used ajax call but it is asynchronous and i faced problems

function GetLibraryActivities(libraryName, callback) {
    $.ajax({
        dataType: "json",
        url: "/WorkflowDesigner/GetLibraryActivities/?libraryName=" + libraryName
    }).done(function (data) {
        console.log(data);
        return data;
    });
}

then I tried to work with callback function, but it didn't work too.

function GetLibraryActivities(libraryName, callback) {
    $.ajax({
        'url': "/WorkflowDesigner/GetLibraryActivities/?libraryName=" + libraryName,
        'type': 'GET',
        'success': callback
    });
}
GetLibraryActivities("Petrophysics", function (data) {
    petrophysicsData = data
});

when I try to use petrophysicsData variable under the code it returns unidentified , I need a mean to call a function in synchronous way, any help will be appreciated thanks.

You cannot return data from inside an async call's callback... Use callbacks or promises to call other callbacks/functions. — iCollect.it Ltd
– iCollect.it Ltd, Commented Oct 14, 2014 at 14:18
because the returned data will be used in another place after some processing , and I call the function multiple times for different libraries. — Ahmed Ghazey
– Ahmed Ghazey, Commented Oct 14, 2014 at 14:22
what is difference between synchronous and serial I think both are the same — Ahmed Ghazey
– Ahmed Ghazey, Commented Oct 14, 2014 at 14:23

guildsbounty · Accepted Answer · 2014-10-14 14:31:24Z

Your main problem here is that you are trying to 'return' something from an AJAX callback. You cannot expect an Async AJAX function to return values to the script function that called it, because the function that called it moved on after the AJAX call started. That is the point of an Async call, it allows the javascript to move on and not have to wait for the server communication to complete.

The best way to handle this is to call all portions of a function in sequential order by using callbacks, never planning to use a return.

So, rather than returning data it would be best to instead call a function that processes data from within the callback function. It can be a little inconvenient, but when working with Async calls, it is best to assume that you can only go deeper into your call stack, rather than returning anything back out of it.

So, rather than your first option...you would want to do something like this instead...

function GetLibraryActivities(libraryName, callback) {
    $.ajax({
        dataType: "json",
        url: "/WorkflowDesigner/GetLibraryActivities/?libraryName=" + libraryName
    }).done(function (data) {
        console.log(data);
        ProcessResults(data);
    });
}

Or, simply perform your processing within the callback.

Pre jQuery 1.8, there was the 'async' option, that would allow you to force Javascript to wait for the ajax call to process...but this locks up the browser while it is processing, and has since been deprecated.

iCollect.it Ltd · Accepted Answer · 2014-10-14 14:50:59Z

If you simply return the Ajax promise like this:

function GetLibraryActivities(libraryName, callback) {
    return $.ajax({
        'url': "/WorkflowDesigner/GetLibraryActivities/?libraryName=" + libraryName,
        'type': 'GET'
    });
}

you can do this to use the value:

GetLibraryActivities("Petrophysics").done(function (data) {
    // do something with petrophysics data
});

and chain them "sequentially" with then like this:

GetLibraryActivities("Petrophysics").then(GetLibraryActivities("Astrophysics")).done(function(pertro, astro){
    // Do something with both results};
});

In this example both will load in parallel, but the done will only be called with both promises have completed (in any order).

If you have loads of these to load, you can use $.when to process multiple promises.

Collectives™ on Stack Overflow

Synchronous javascript call to MVC 4 Controller action

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related