Problem with Javascript Object Code and jQuery Promise

Question

I know that I am just mising something, but here is the issue:

I have created a helper function:

    var RADON = window.RADON || {};
RADON.csom = RADON.csom || {};

RADON.csom.GetLookupData = function () {
    var getvalues = function (site, list, field) {
        var xml = "<View><Method Name='Read List' /><Query><OrderBy><FieldRef Name='" + field + "'/></OrderBy><Where><IsNotNull><FieldRef Name='" + field + "'/></IsNotNull></Where></Query>";
        xml += "<ViewFields>";
        xml += "<FieldRef Name='" + field + "'/>";
        xml += "<FieldRef Name='ID'/>";
        xml += "</ViewFields>";
        xml += "</View>";
        var deferred = $.Deferred();
        var ctx = new SP.ClientContext(site);
        this.list = ctx.get_web().get_lists().getByTitle(list);
        this.caml = new SP.CamlQuery();
        this.caml.set_viewXml(xml);
        this.items = this.list.getItems(this.caml);
        ctx.load(this.items);
        ctx.executeQueryAsync(Function.createDelegate(this, function () { deferred.resolve(this.items); }), Function.createDelegate(this, function (sender, args) { deferred.reject(sender, args); }));
        return deferred.promise();
    };

    return {
        getvalues: getvalues
    };
} ();

RADON.csom.FillDropdowns = function (items, field, dropdowns, cascade, cascadesite, cascadelist, cascadefield) {
    var opts = "<option value='Select...'>Select...</option>";
    var enumerator = items.getEnumerator();
    var unique = "";
    while (enumerator.moveNext()) {
        var li = enumerator.get_current();
        if (li.get_item(field) != unique) {
            opts += "<option value='" + li.get_item("ID") + ";#" + li.get_item(field) + "'>" + li.get_item(field) + "</option>";
            unique = li.get_item(field);
        }
    }
    logit("Dropdowns Length: " + dropdowns.length);
    for (var z=0; z <= dropdowns.length; z++) {
        $("#" + dropdowns[z]).html("").append(opts);
    }
};

This code is called by another function after SP.js is loaded:

    function GetLookupValues() {
    waitDialog = SP.UI.ModalDialog.showWaitScreenWithNoClose('Loading Data...', 'Please wait while the Contract is Loaded...', 76, 400);
    RADON.csom.GetLookupData.getvalues(siteurl, "ddl514", "BaseOptionYr").then(
        function (items) {
            RADON.csom.FillDropdowns(items, "BaseOptionYr", ["Period2", "Period3", "Period4", "Period5", "WhatOptionYear"], false, null, null, null)
            lcount += 1;
            if (lcount == 3) { Loaded(); }
        },
        function (sender, args) {
            logit("LookupValues Failed 1: " + args.get_message());
        }
    );
    RADON.csom.GetLookupData.getvalues(siteurl , "ddl514", "FundsAvailable").then(
        function (items) {
            RADON.csom.FillDropdowns(items, "FundsAvailable", ["FundsAvailable"], false, null, null, null)
            lcount += 1;
            if (lcount == 3) { Loaded(); }
        },
        function (sender, args) {
            logit("GetLookupValues Failed 2: " + args.get_message());
        }
    );
    RADON.csom.GetLookupData.getvalues(siteurl, "ddl514", "FundSource").then(
        function (items) {
            RADON.csom.FillDropdowns(items, "FundSource", ["SourceofFunds"], false, null, null, null)
            lcount += 1;
            if (lcount == 3) { Loaded(); }
        },
        function (sender, args) {
            logit("GetLookupValues Failed 3: " + args.get_message());
        }
    );
};

My problem is that the first call runs fine if I rem out the other 2. I am using this to populate dropdowns and there are a lot of different dropdowns I am getting data for. I just feel like the problem could be scope related, but not sure. I get the

"The collection has not been initialized. It has not been requested or the request has not been executed."

error on the other 2 calls

Have you located the exact line where the errors originate? Which version of jQuery are you using? Anything helpful from Fiddler trace? — Alexey Krasheninnikov
– Alexey Krasheninnikov, Commented Nov 10, 2014 at 20:11

iOnline247 · Accepted Answer · 2014-11-12 15:02:20Z

1

This is directly related to your execution context of RADON.csom.GetLookupData.getvalues and also the crappy MSDN sample code that is out there for CSOM.

If you tweak your code to get rid of this and use a local variable, then #bind your executeQueryAsync success handler to that variable, you'll create a scope with the correct execution context.

Here's an example:

    RADON.csom.GetLookupData = function () {
            var getvalues = function (site, list, field) {
                var xml = "<View><Method Name='Read List' /><Query><OrderBy><FieldRef Name='" + field + "'/></OrderBy><Where><IsNotNull><FieldRef Name='" + field + "'/></IsNotNull></Where></Query>";
                xml += "<ViewFields>";
                xml += "<FieldRef Name='" + field + "'/>";
                xml += "<FieldRef Name='ID'/>";
                xml += "</ViewFields>";
                xml += "</View>";
                var deferred = $.Deferred();
                var success = function () { deferred.resolve(this); };
                var ctx = new SP.ClientContext(site);
                var list = ctx.get_web().get_lists().getByTitle(list);
                var caml = new SP.CamlQuery();
                caml.set_viewXml(xml);
                var items = list.getItems(caml);
                ctx.load(items);
                ctx.executeQueryAsync(
                    success.bind(items), 
                    function (sender, args) { deferred.reject(sender, args); }
                );
                return deferred.promise();
            };

            return {
                getvalues: getvalues
            };
        } ();

This code needs to be tested, but it should work.

edited Nov 12, 2014 at 15:02

answered Nov 10, 2014 at 20:57

iOnline247

1,6761 gold badge15 silver badges29 bronze badges

Yes, Matt I do believe I tried without the 'this' piece but will give it another go on Wednesday as I am off tomorrow! I normally do not use 'this' for these, but was following a different example to reference using promises which so far are wicked fast!

spevilgenius
– spevilgenius

2014-11-10 23:16:28 +00:00
Commented Nov 10, 2014 at 23:16
A simple test would be to log out this === window. You'll know precisely what's going on then when your looking at it inside the console.

iOnline247
– iOnline247

2014-11-10 23:41:51 +00:00
Commented Nov 10, 2014 at 23:41
this code unfortunately has an error in the ctx.executeQueryAsync syntax. Trying to figure out what it is...

spevilgenius
– spevilgenius

2014-11-12 11:11:52 +00:00
Commented Nov 12, 2014 at 11:11
The following edits seemed to have worked! Thanks Matt for the second set of eyes! var items = zlist.getItems(caml); ctx.load(items); ctx.executeQueryAsync( Function.createDelegate(this, function () { deferred.resolve(items); }), Function.createDelegate(this, function (sender, args) { deferred.reject(sender, args); }) );

spevilgenius
– spevilgenius

2014-11-12 11:22:44 +00:00
Commented Nov 12, 2014 at 11:22
Accepted Captain Needa!

spevilgenius
– spevilgenius

2014-11-12 11:24:41 +00:00
Commented Nov 12, 2014 at 11:24

| Show 1 more comment

Stack Exchange Network

Problem with Javascript Object Code and jQuery Promise

1 Answer 1

Your Answer

Hot Network Questions

Problem with Javascript Object Code and jQuery Promise

1 Answer 1

Your Answer

Sign up or log in

Post as a guest

Related

Hot Network Questions