Retrieve List Items Using JavaScript

Retrieving Items from a List Using JavaScript (CAML)

The getItems(query) function enables you to define a Collaborative Application Markup Language (CAML) query that specifies which items to return. You can pass an undefined CamlQuery object to return all items from the list, or use the set_viewXml function to define a CAML query and return items that meet specific criteria.

The following example displays the ID, in addition to the Title and Body column values, of the first 100 items in the Announcements list, starting with list items whose collection ID is greater than 10.

var siteUrl = '/sites/MySiteCollection';

function retrieveListItems() {

 var clientContext = new SP.ClientContext(siteUrl);

    var oList = clientContext.get_web().get_lists().getByTitle('Announcements');

    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 listItemInfo = '';

    var listItemEnumerator = collListItem.getEnumerator();

    while (listItemEnumerator.moveNext()) {

        var oListItem = listItemEnumerator.get_current();

        listItemInfo += '\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 previous example loads the collection of items specified by the CAML query, and all default properties can subsequently be accessed on each list item object that is returned. In ECMAScript (JavaScript, JScript), specify the Include statement as part of the query string that is passed to the load(clientObject) function.