Selecting all list items with sp.js CSOM

Question

I'm trying to write a web part to do a 'Have You Met' type function where it displays a random user but having trouble with the list enumeration.

Currently it works like this:

1. CSOM script run on my desktop enumerates user profiles and puts the required data into a list, along with a field called 'scriptIndex' to act as a key (because the built-in ID field is unpredictable after a list has had multiple items)

2. Script Editor web part gets a count of the number of list items (this bit is working)

3. SEWP generates a random number between 1 and the number of list items (this bit also working)

4. SEWP issues a CAML query to select all items and iterate them (doing it this way for testing, but when I have the method working it will only select one item where 'scriptIndex' column equals the randomly generated number)

Code is below:

 <div id="hymUser">Replace me with the count</div>

<script type="text/javascript">

// Call the function once page is loaded
SP.SOD.executeFunc('sp.js','SP.ClientContext',runWhenLoaded);

//Shared Global Variables
var clientContext;
var oWeb;
var oList;
var currentUserIndex;
var userCount;

function runWhenLoaded() {
// Create context, get the rootweb, then get the list
        clientContext = SP.ClientContext.get_current(); 
        oWeb =  clientContext.get_web();
        oList = oWeb.get_lists().getByTitle("DS_HaveYouMet");
        clientContext.load(oList);

        // Execute the queued context commands (passes back to the global vars)
        clientContext.executeQueryAsync(runOnSuccess,function() { alert("Error"); } );
    }

// Callback function for async success
function runOnSuccess() {
            // Assign the total items count to the pre-created global variable
            userCount = oList.get_itemCount();

        // Generate a random number between 1 and the number of users
        currentUserIndex = Math.random() * (userCount - 1) + 1;
        currentUserIndex = Math.floor(currentUserIndex);

        // Put the value inside the WP
        document.getElementById('hymUser').innerHTML = 'User ' + currentUserIndex + ' of ' + userCount;

        // Get all list items via CAML
        var camlQuery = SP.CamlQuery.createAllItemsQuery();
        var allItems = oList.getItems(camlQuery);
        clientContext.load(allItems, 'Include(hymDisplayName)');

        clientContext.executeQueryAsync(runListQuery,function() { alert('List get failed'); } );
    }

// Callback function for list get
function runListQuery() {
        var listEnum = allItems.getEnumerator();
        while (listEnum.moveNext()) {
                var currentItem = listEnum.get_current();
                alert(currentItem.hymDisplayName);
            }
    }

</script>

It all works fine up to the line var allItems = oList.getItems(camlQuery);, then I get the following error from the console:

Any ideas? I copied the list enumeration bit from http://sharepoint1on1.blogspot.co.uk/2015/06/sharepoint-2013-get-list-items-with.html which should work, I cannot for the life of me see the problem.

Answer 1

Its failing because the scope of the variable allItems is inside the runOnSuccess function.

Replace it as below:

clientContext.load(allItems, 'Include(hymDisplayName)');

        //clientContext.executeQueryAsync(runListQuery,function() { alert('List get failed'); } );

        clientContext.executeQueryAsync(function(){
                var listEnum = allItems.getEnumerator();
                while (listEnum.moveNext()) {
                    var currentItem = listEnum.get_current();
                    alert(currentItem.get_item('hymDisplayName'));
                }   
        },function() { alert('List get failed'); } );

Your full code would be:

<div id="hymUser">Replace me with the count</div>

<script type="text/javascript">

// Call the function once page is loaded
SP.SOD.executeFunc('sp.js','SP.ClientContext',runWhenLoaded);

//Shared Global Variables
var clientContext;
var oWeb;
var oList;
var currentUserIndex;
var userCount;

function runWhenLoaded() {
// Create context, get the rootweb, then get the list
        clientContext = SP.ClientContext.get_current(); 
        oWeb =  clientContext.get_web();
        oList = oWeb.get_lists().getByTitle("DS_HaveYouMet");
        clientContext.load(oList);

        // Execute the queued context commands (passes back to the global vars)
        clientContext.executeQueryAsync(runOnSuccess,function() { alert("Error"); } );
    }

// Callback function for async success
function runOnSuccess() {
            // Assign the total items count to the pre-created global variable
            userCount = oList.get_itemCount();

        // Generate a random number between 1 and the number of users
        currentUserIndex = Math.random() * (userCount - 1) + 1;
        currentUserIndex = Math.floor(currentUserIndex);

        // Put the value inside the WP
        document.getElementById('hymUser').innerHTML = 'User ' + currentUserIndex + ' of ' + userCount;

        // Get all list items via CAML
        var camlQuery = SP.CamlQuery.createAllItemsQuery();
        var allItems = oList.getItems(camlQuery);
        clientContext.load(allItems, 'Include(hymDisplayName)');

        //clientContext.executeQueryAsync(runListQuery,function() { alert('List get failed'); } );

        clientContext.executeQueryAsync(function(){
                var listEnum = allItems.getEnumerator();
                while (listEnum.moveNext()) {
                    var currentItem = listEnum.get_current();
                    alert(currentItem.get_item('hymDisplayName'));
                }   
        },function() { alert('List get failed'); } );

    }

</script>