How do I get the ExecuteQueryAsync to behave more synchronously?

Question

Aight..this Sharepoint using Javascript..I'm using Alerts to debug my Javascript that runs from a Content Editor Web Part; the script is in the Assets library .

I get it...the WHOLE POINT of "async" function calls is to not wait around for the call to finish....but I fear the actions in the ExecuteQueryAsync, upon which future actions rely, would not complete resulting in error.

I'm quite certain that, because of my Alert IN & Alert BACK firing "backwards" that i'm indeed getting my Asynchronous behaviour. I tried "ExecuteQuery" without the "Async" part...THAT failed miserably.

Somebody wanna gimme a shove in the right direction toward getting the activities in my ONSUCCESS function to finish before returning to the OBJ function?

function One()
{
alert("in ONE");
OBJ();
alert("back from Obj, in One Again");
}

function OBJ(){
alert("in OBJ");
 var clientContext = null; 
 var currentweb = null; 
        clientContext = new SP.ClientContext.get_current(); 
        web = clientContext.get_web(); 
        var Questionlist = web.get_lists().getByTitle("Exam Objectives"); 
        var camlQuery = new SP.CamlQuery();
        var q = "";    //camlQuery text in q to limit colls returned, empty string returns all
        camlQuery.set_viewXml(q); 
        this.listItems = Questionlist.getItems(camlQuery); 

        clientContext.load(listItems);
         clientContext.executeQueryAsync(Function.createDelegate(this, this.onListItemsLoadSuccessObj), Function.createDelegate(this,         this.onQueryFailed)); 
 alert("leaving OBJ");    //THIS ALERT FIRES BEFORE THE ALERT BELOW********
 }

function onListItemsLoadSuccessObj(sender, args) { 
 var listItemInfo = '';
 var oListItem = null;
var listItemEnumerator = listItems.getEnumerator();

while (listItemEnumerator.moveNext()) {
    oListItem = listItemEnumerator.get_current();
    listItemInfo += '\nID: ' + oListItem.get_id() + 
        '\nTitle: ' + oListItem.get_item('Title');
}

alert(listItemInfo.toString());  //THIS ALERT FIRES AFTER THE ALERT ABOVE*********     
}

Solution

You want to look into Promises. Scot Hillier has an excellent write up here: http://www.shillier.com/archive/2013/03/04/using-promises-with-the-javascript-client-object-model-in-sharepoint-2013.aspx but essentially they allow you to write code like this:

doSomething()
.then(doSomethingElseWhenThatsDone, orHandleAnError)
.then(doYetAnotherThingWhenThatsDone, orHandleAnError);

The functions you call to do your work (doSomething, doSomethingElseWhenThatsDone, doYetAnotherThingWhenThatsDone) would look something like this:

function doSomething(){
    //set up some JSOM stuff
    var dfd = $.Deferred();
    context.executeQueryAsync(
        function () {
            dfd.resolve();
        }, function (sender, args) {
            dfd.reject(sender, args, errorMsg);
        });
    return dfd.promise()
}

Each sets up a JQuery Deferred object and returns it's Promise. The Promise causes the calling function to sit and wait until the Promise is either resolved or rejected (in the success or failure callbacks of ExecuteQueryAsync respectively).

You can do a lot more with promises, this barely scratches the surface. In general, they allow you to, when necessary, force async calls to be performed in a synchronous manner.

HTH,

Dave

Comments

[Ohgodwhy]

You're essentially trying to impede further script progression using an asynchronous callback which is not possible.

[jazaddict]

And so instead I should....?????

[ferr]

this is poor design on the part of MS, you should be given the option of synchronous calls.

[jazaddict]

So "onListItemsLoadSuccessObj" is a "callback"? I ask, because I HAD moved my code into that function...that's where the alert is. ...or maybe I don't understand "callback"?

[Erik Noren]

It's a callback in that it's "called back" from the completion of the async code. You can specify a callback (or delegate) that is used to "finish up" your work. Basically if you have code that depends on the completion of your async query finishing first, you need to put it (or call it from) the delegate/callback handlers.

[jazaddict]

THx David....I knew I was askin to "override" the asynchronous behaviour that was acting as advertised, and this information seems to explain exactly that. I've taken a couple of cracks at it & failed because I'm a newb, but I can see that IF I were to shoe-horn this solution into my dilemna it'd take care of my need for order.....I'll figure out how to employ this eventually.

[ameliapond]

@David the link is dead. Thx

[TimTheEnchanter]

Well...this is from 3 years ago, and Scot's post from 4, so... In any event, there's enough in my answer to get you started.