Dynamic calling function to read data from SP List

Question

I'm trying to do something similar to this, but with a dynamic calling function name so that I can reuse the function. I followed Danny's suggestion, but I am getting the error:

Uncaught TypeError: Cannot read property 'getEnumerator' of undefined

With the below code, I'm hoping someone might be able to help me figure out why it won't load the data. I did get everything to work up to and including the output of "Entered loadBudgetYear".

    // Load the required SharePoint libraries.
$(document).ready(function () {

    hostweburl="https://mysite.sharepoint.com";

    // The js files are in a URL in the form:
    // web_url/_layouts/15/resource_file
    var scriptbase = hostweburl + "/_layouts/15/";

    // Load the js files and continue to
    // the execOperation function.
    $.getScript(scriptbase + "SP.Runtime.js",
        function () {
            $.getScript(scriptbase + "SP.js", loadReady);
        }
    );
});

function loadReady() {

    var url = 'https://mysite.sharepoint.com';

    retrieveListItems(url, loadBudgetYear(), "listBudget");
    retrieveListItems(url, loadDropdown2(), "listDropdown2");
    retrieveListItems(url, loadDropdown3(), "listDropdown3");

};

// Container for retrieving list items from SharePoint site
function retrieveListItems(siteUrl, cFunction, listName) {
    var request={};
    request.listName = listName;
    request.siteUrl = siteUrl || _spPageContextInfo.siteAbsoluteUrl;

    var clientContext = new SP.ClientContext(request.siteUrl);
    var oList = clientContext.get_web().get_lists().getByTitle(request.listName);

    request.camlQuery = new SP.CamlQuery();

    request.collListItem = oList.getItems(request.camlQuery);

    clientContext.load(request.collListItem);

    clientContext.executeQueryAsync(
        Function.createDelegate(cFunction.bind(request)),
        Function.createDelegate(this, this.onQueryFailed)
    );

}

function onQueryFailed(sender, args) {

    console.log('Request failed. ' + args.get_message() + '\n' + args.get_stackTrace());
}

function loadBudgetYear() {
    console.log("Entered loadBudgetYear");

    var received=this;
    received.items=[];
    var listItemInfo = '';
    var listItemEnumerator = received.collListItem.getEnumerator();

    while (listItemEnumerator.moveNext()) {
        var oListItem = listItemEnumerator.get_current();        
        listItemInfo += '<option value =' + oListItem.get_item('BudgetYearID') + '>' + oListItem.get_item('BudgetYear') + '</option>';
    }

    $('#budgetYr').append(listItemInfo.toString());
};

function loadDropdown2() {

    var received=this;
    received.items=[];
    var listItemInfo = '';
    var listItemEnumerator = received.collListItem.getEnumerator();

    while (listItemEnumerator.moveNext()) {
        var oListItem = listItemEnumerator.get_current();        
        listItemInfo += '<option value =' + oListItem.get_item('fooID') + '>' + oListItem.get_item('foo') + '</option>';
    }

    $('#dropdown2').append(listItemInfo.toString());
};

function loadDropdown3() {

    var received=this;
    received.items=[];
    var listItemInfo = '';
    var listItemEnumerator = received.collListItem.getEnumerator();

    while (listItemEnumerator.moveNext()) {
        var oListItem = listItemEnumerator.get_current();        
        listItemInfo += '<option value =' + oListItem.get_item('barID') + '>' + oListItem.get_item('bar') + '</option>';
    }

    $('#dropdown3').append(listItemInfo.toString());
};

Answer 1

In your function ready you should pass a reference to your next function (which get executed when a request is ready). In your code you execute the function instead of passing the reference. Consider how the code should look like:

function loadReady() {

    var url = 'https://mysite.sharepoint.com';

    retrieveListItems(url, loadBudgetYear, "listBudget");
    retrieveListItems(url, loadDropdown2, "listDropdown2");
    retrieveListItems(url, loadDropdown3, "listDropdown3");

};  

You should also fix your retrieveListItems function:

clientContext.executeQueryAsync(
        Function.createDelegate(request, cFunction.bind(request)),
        Function.createDelegate(this, this.onQueryFailed)
    );