I have code like this (Default.aspx):

<asp:Label id="LabelA" runat="server" Text="0"></asp:Label> 
<script type="text/javascript"> 
document.getElementById('LabelA').innerHTML = getVerificheCount('ListTitle','StatusNotOk'); 

Code in App.js:

var verificheList;
var ctx = SP.ClientContext.get_current();
var hostWebURL = decodeURIComponent(getQueryStringParameter("SPHostUrl"));
var verbaleList;
var statoVerifica;
var listTitle = '';
var countItems;

function getVerificheCount(title, stato) {
    statoVerifica = stato;
    listTitle = title;
    var hostWebContext = new SP.AppContextSite(ctx, hostWebURL);
    verbaleList = hostWebContext.get_web().get_lists().getByTitle(listTitle);
    var camlQuery = new SP.CamlQuery();
        '<View><Query><Where><Eq>' +
        '<FieldRef Name=\'Verifica\'/><Value Type=\'Choice\'>' + stato + '</Value>' +
    verificheList = verbaleList.getItems(camlQuery);
    ctx.executeQueryAsync(function() {
        countItems = verificheList.get_count();
    }, onGetverificheListFail);
    return countItems;

I'd like to use jquery promise, but where should I insert it?

2 Answers 2


You don't necessarily need to use a promise here, just don't try to set the value of the HTML element until after you get your result.

So in your default.aspx:

<asp:Label id="LabelA" runat="server" Text="0"></asp:Label> 
<script type="text/javascript">
// just kick off the asynchronous call

And in your App.js:

ctx.executeQueryAsync(function() {
    // now that you have your result, go ahead and set the value of the label
    document.getElementById('LabelA').innerHTML = verificheList.get_count();
}, onGetverificheListFail);
// now you also don't need to return anything from this function
// return countItems;

One thing to watch out for - it's been a while since I've done stuff like this, but if I recall correctly, if you set your label to runat="server", the server is going to rewrite the id, so your document.getElementById('LabelA') might not work... right? Can anyone else confirm or deny what I'm saying about the ID rewriting?

  • Ok, I like your approach, because it is clear and simple... However the doubt is... What happen if the getVerificheCount function runs for X seconds? the page is blocked or not?
    – spiderman
    Oct 5, 2018 at 14:11
  • 1
    The page will not be blocked. executeQueryAsync is an asynchronous call. Oct 5, 2018 at 14:35
  • 1
    To ensure the id of your label is LabelA you will either have to add the ClientIDMode="Static" attribute to the Label server control or replace the server control with a HTML element like a Span. Oct 5, 2018 at 14:39
  • Thanks @RobWindsor, I didn't even know about the ClientIDMode="Static" option, I'll have to read up on that! Oct 5, 2018 at 14:40

Here's an example of how to wrap a JSOM call in a jQuery promise. You should be able to modify the code above to use the same calling pattern.

function getListsCsomJquery(rowLimit) {
    var dfd = jQuery.Deferred();

    var context = SP.ClientContext.get_current();
    var web = context.get_web();
    var lists = web.get_lists();
    var listsArray = context.loadQuery(lists);
    context.executeQueryAsync(success, fail);

    function success() {
        dfd.resolve(listsArray.slice(0, rowLimit));

    function fail(sender, args) {
        dfd.reject({ responseText: args.get_message() });

    return dfd.promise();

function jqueryCsomButtonClick() {
    var message = container.find("#message");

    var call = getListsCsomJquery(10);
    call.done(function (data) {
        data.forEach(function (list) {
    call.fail(function (errorObject) {

    message.text("Waiting for result...");

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.