0

I've been using the code here with a few modifications for my own code to access a list on my SharePoint site through JavaScript. This script is in the ASP.Net for the initiation form of a workflow on the site. I have seen lots of other answers for this but not any that have worked for me. I've inserted alerts into the code and found that it is running through the whole thing, but the issue is that when getList() function finishes running, the listItemInfo array is empty.

var listItemInfo = [];

window.onload = function()
{
    populateCatalystComboBox();
};

function populateCatalystComboBox()
{
    var catalystList = [];
    var index = 0;
    var select = document.getElementById("catalystSelections");

    getList();

    document.getElementById("testLabel").innerHTML = listItemInfo[0];
    alert ("Here");
    for (var i=0; i<listItemInfo.length; i++)
    {
        index = listItemInfo[i].indexOf("Chemical Type: ") + 14;
        if (listItemInfo[i].substring(index) == "Catalyst")
        {
            catalystList.push(listItemInfo[i]);
        }
    }

    catalystList.push("Test 3");
    catalystList.push("Test 4");

    //document.getElementById("testLabel").innerHTML = (catalystList.toString());

    for (i=0; i<catalystList.length; i++)
    {
        var catalyst = catalystList[i];
        var newOption = document.createElement("option");
        newOption.textContent = catalyst;
        newOption.value = catalyst;
        select.appendChild(newOption);
    }
}

function getList()
{
    var clientContext = new SP.ClientContext("https://____.sharepoint.com/sites/______/");
    var oList = clientContext.get_web().get_lists().getByTitle('ChemicalsTable');

    var camlQuery = new SP.CamlQuery();
    camlQuery.set_viewXml('<View><Query><Where><Geq><FieldRef Name=\'ID\'/>' + 
        '<Value Type=\'Number\'>1</Value></Geq></Where></Query><RowLimit>10</RowLimit></View>');
    this.collListItem = oList.getItems(camlQuery);

    clientContext.load(collListItem);

    clientContext.executeQueryAsync(Function.createDelegate(this, this.onQuerySucceeded), Function.createDelegate(this, this.onQueryFailed));
}

function onQuerySucceeded(sender, args) {
    var listItemEnumerator = collListItem.getEnumerator();

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

    alert(listItemInfo.toString());
}

function onQueryFailed(sender, args) {
    alert('Request failed. ' + args.get_message() + '\n' + args.get_stackTrace());
}

The alert "Here" does display and the innerHTML = listItemInfo[0] becomes "undefined".

UPDATE: I've found that when I insert an alert(oListItem.get_id()); in onQuerySucceeded(sender, args) in the while loop it outputs the correct data. However, when I put in alert(oListItem.get_item('ChemicalName'));, the alert doesn't pop up. It is instead popping up with an alert that the column name (ChemicalName) doesn't exist. The problem is, it does. The URL is the one for my site, it paths to Site Contents->Lists->Chemicals Table as it should where there is a column named ChemicalName.

  • If you want to retrieve data from listItemInfo as if it were an array, you need to define it as an array (var listItemInfo = []), and use .push() instead of concatenating a string (+=). – Erin L Aug 10 '16 at 15:00
  • Thanks for pointing that out, I had fixed that before but for some reason it reverted. – Ulthran Aug 10 '16 at 15:05
1

You tried to run jsom without loaded sp.js

try to call sp.js before running any jsom function as the following

 $(document).ready(function () {     
        SP.SOD.executeFunc('sp.js', 'SP.ClientContext', prepareTables);
    });

so remove

window.onload = function()
{
    populateCatalystComboBox();
};

and replace it with

$(document).ready(function () {

            SP.SOD.executeFunc('sp.js', 'SP.ClientContext', prepareTables);
            populateCatalystComboBox();
        });
2

Please try with using defered and promise on function getList() as it is asyn call, you can refer link for using defered.SharePoint JavaScript client object model is asynchronous. However, sometimes we want to process things in synchronous way. This can be done by using JavaScript call backs and deferreds/Promises.

We're looking for long answers that provide some explanation and context. Don't just give a one-line answer; explain why your answer is right, ideally with citations. Answers that don't include explanations may be removed.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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