none
Not Able to retrieve more than two column (ID an Title) from SharePoint list using JavaScript

    Question

  • Hello All,

    I have a list called 'jsTest' in my SharePoint online (2013) site and I would like to retrieve the last four rows with the following columns name: "ID", "Title", "FirstName", "LastName", "Level".

    I am just able to retrieve two columns which are "ID" and "Title" instead of five columns.

    Here is the code I was using to retrieve two columns "ID", "Title":

    <div class="test1">
      <p id="test3">Undefined</p>
    </div>
    <div class="test1">
      <p id="test3">Undefined</p>
    </div>
    
    <script>
    
    SP.SOD.executeOrDelayUntilScriptLoaded(showListItems,"core.js");
    
    function showListItems(){
        var clientContext = new SP.ClientContext();
        var list = clientContext.get_web().get_lists().getByTitle("jsTest");
        var camlQuery = new SP.CamlQuery();
        camlQuery.set_viewXml(
             "<View><Query>" +
                "<OrderBy><FieldRef Name=\"Modified\" Ascending=\"FALSE\"/></OrderBy>" +
            "</Query>"+
              "<RowLimit>4</RowLimit>" +
            "</View>");
        var items = list.getItems(camlQuery);
        clientContext.load(items);
        clientContext.executeQueryAsync(function(){
            var itemArray = [];
            var ids = [];
            var itemEnumerator = items.getEnumerator();
            while(itemEnumerator.moveNext()){
                var item = itemEnumerator.get_current();
                var id = item.get_item("ID");
                var title = item.get_item("Title");
                itemArray.push(id + ", " + title);
                ids.push(id);
            }
            {
             document.getElementById("test2").innerHTML = itemArray;
             document.getElementById("test3").innerHTML = ids;}
    
        },function(sender,args){alert(args.get_message());});
    }
    </script>

    And here is the code I modified to be able to display five columns:

    <div class="test1">
      <p id="test2">Undefined</p>
    </div>
    <div class="test1">
      <p id="test3">Undefined</p>
    </div>
    <div class="test1">
      <p id="test4">Undefined</p>
    </div>
    <div class="test1">
      <p id="test5">Undefined</p>
    </div>
    <div class="test1">
      <p id="test6">Undefined</p>
    </div>
    
    <script>
    
    SP.SOD.executeOrDelayUntilScriptLoaded(showListItems, "core.js");
    
    function showListItems(){
        var clientContext = new SP.ClientContext();
        var list = clientContext.get_web().get_lists().getByTitle("jsTest");
        var camlQuery = new SP.CamlQuery();
        var caml = "<View>";
        caml += "<Query><OrderBy><FieldRef Name='ID' Ascending='FALSE'/></OrderBy></Query>";
        caml += "<ViewFields><FieldRef Name='ID'/><FieldRef Name='Title'/><FieldRef Name='FirstName'/></ViewFields>";
        caml += "<RowLimit>4</RowLimit>";
        caml += "</View>";
        camlQuery.set_viewXml(caml);
        var items = list.getItems(camlQuery);
        clientContext.load(items, "ID", "Title", "FirstName", "LastName", "Level");
        clientContext.executeQueryAsync(function(){
            var itemArray = [];
            var ids = [];
            var firstNames = [];
            var lastNames = [];
            var levels = [];
            var itemEnumerator = items.getEnumerator();
            while(itemEnumerator.moveNext()){
                var item = itemEnumerator.get_current();
                var id = item.get_item("ID");
                var title = item.get_item("Title");
                var firstName = item.get_item("FirstName");
                var lastName = item.get_item("LastName");
                var level = item.get_item("Level");
                itemArray.push(id + ", " + title + ", " + firstName + ", " + lastName + ", "+ level);
                ids.push(id);
                firstNames.push(firstName);
                lastNames.push(lastName);
                levels.push(level);
            }
             {
             document.getElementById("test2").innerHTML = itemArray;
             document.getElementById("test3").innerHTML = ids;
             document.getElementById("test4").innerHTML = firstNames;
             document.getElementById("test5").innerHTML = lastNames;
             document.getElementById("test6").innerHTML = levels;
            }
    
        },function(sender,args){alert(args.get_message());});
    }
    </script>
    

    Here is the errors I am receiving while trying to use the modified code:  Field or property "ID" does not exist

    Please could you help me to have the correct code for the purpose? 

    Thursday, March 14, 2019 1:40 PM

All replies

  • Hi Bogo,

    Modified code as below:

    <script type="text/javascript">
    
    SP.SOD.executeOrDelayUntilScriptLoaded(retrieveListItems, "sp.js");
     var itemArray = [];
     var ids = [];
     var firstNames = [];
     var lastNames = [];
     var levels = [];
    
    function retrieveListItems() {
    
        var clientContext = new SP.ClientContext.get_current();
        var list = clientContext.get_web().get_lists().getByTitle('jsTest');
            
       var camlQuery = new SP.CamlQuery();
        var caml = "<View>";
        caml += "<Query><OrderBy><FieldRef Name='ID' Ascending='FALSE'/></OrderBy></Query>";
        caml += "<ViewFields><FieldRef Name='ID'/><FieldRef Name='Title'/><FieldRef Name='FirstName'/><FieldRef Name='LastName' /><FieldRef Name='Level' /></ViewFields>";
        caml += "<RowLimit>4</RowLimit>";
        caml += "</View>";
        camlQuery.set_viewXml(caml);
        this.items = list.getItems(camlQuery);
        clientContext.load(items);
            
        clientContext.executeQueryAsync(Function.createDelegate(this, this.onQuerySucceeded), Function.createDelegate(this, this.onQueryFailed));        
            
    }
    
    function onQuerySucceeded(sender, args) {
    
        var itemEnumerator = items.getEnumerator();
            
        while (itemEnumerator.moveNext()) {
            var item = itemEnumerator.get_current();
              var id = item.get_item("ID");
              var title = item.get_item("Title");
              var firstName = item.get_item("FirstName");
              var lastName = item.get_item("LastName");
              var level = item.get_item("Level");
              itemArray.push(id + ", " + title + ", " + firstName + ", " + lastName + ", "+ level);
              ids.push(id);
              firstNames.push(firstName);
              lastNames.push(lastName);
              levels.push(level);
              
      		  
          }
          
             document.getElementById("test2").innerHTML = itemArray;
             document.getElementById("test3").innerHTML = ids;
             document.getElementById("test4").innerHTML = firstNames;
             document.getElementById("test5").innerHTML = lastNames;
             document.getElementById("test6").innerHTML = levels;
    }
    
    function onQueryFailed(sender, args) {
    
        alert('Request failed. ' + args.get_message() + '\n' + args.get_stackTrace());
    }
    </script>
    
    <div class="test1">
      <p id="test2">Undefined</p>
    </div>
    <div class="test1">
      <p id="test3">Undefined</p>
    </div>
    <div class="test1">
      <p id="test4">Undefined</p>
    </div>
    <div class="test1">
      <p id="test5">Undefined</p>
    </div>
    <div class="test1">
      <p id="test6">Undefined</p>
    </div>
    

    This is the test list data:

    Render in the page after running script:

    Thanks

    Best Regards


    Please remember to mark the replies as answers if they helped. If you have feedback for TechNet Subscriber Support, contact tnmff@microsoft.com.

    SharePoint Server 2019 has been released, you can click here to download it.
    Click here to learn new features. Visit the dedicated forum to share, explore and talk to experts about SharePoint Server 2019.

    Friday, March 15, 2019 6:02 AM