Sunday, October 7, 2012

Retrieve SharePoint List Items Using ECMA Script Part 2

As explained in previous post I will show how to retrieve list items using getItems (query). Here we will use the same SharePoint list specified in previous post. We will replace ECMA Script code specified in the Content Editor Web part.
getItems (query) function enables us to define CAML query that specifies which items to return or we can use the set_viewXml function to define query and return items that meet specific criteria.
Approach 1:
<script type="text/ecmascript">

ExecuteOrDelayUntilScriptLoaded(RetrieveListItems, "sp.js");

function RetrieveListItems()
{
  var clientContext = new SP.ClientContext.get_current();
  var oList = clientContext.get_web().get_lists().getByTitle('Employees');
  var CAMLquery = SP.CamlQuery.createAllItemsQuery();
  this.oAllListItem = oList.getItems(CAMLquery);
  //clientContext.load(this.oAllListItem);
clientContext.load(this.oAllListItem,'Include(Id,Title, LastName,WorkingUnit)');
  clientContext.executeQueryAsync(Function.createDelegate(this,this.OnSuccess), Function.createDelegate(this,                 this.OnFailure));
  }

function OnSuccess()
{

    var Html ='';
    var ListEnumerator = this.oAllListItem.getEnumerator();
Html='<table cellspacing="3" cellpadding="3" border="0"><tr><td>ID</td><td> First Name</td><td> Last Name</td><td> Department</td></tr>';
    while(ListEnumerator.moveNext())
    {
                var oItem = ListEnumerator.get_current();
                var ID= oItem.get_id();
var title=oItem.get_item('Title');
var lastName=oItem.get_item('LastName');
var dept=oItem.get_item('WorkingUnit');
   
   Html += '<tr><td>'+ID+'</td><td>'+title+'</td><td>'+lastName+'</td><td>'+
                    dept+'</td></tr></table>';
  
   }

   document.getElementById('ECMADiv').innerHTML =Html;
 }

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

</script>

Approach 2:
<script type="text/ecmascript">

ExecuteOrDelayUntilScriptLoaded(RetrieveListItems, "sp.js");

function RetrieveListItems()
{
  var clientContext = new SP.ClientContext.get_current();
  var oList = clientContext.get_web().get_lists().getByTitle('Employees');
  var camlQuery = new SP.CamlQuery();
  camlQuery.set_viewXml('<View><Query><Where><Geq><FieldRef Name=\'ID\'/>' +
        '<Value Type=\'Number\'>2</Value></Geq></Where></Query><RowLimit>2</RowLimit></View>');
 
  this.oAllListItem = oList.getItems(camlQuery);
  clientContext.load(this.oAllListItem);

  clientContext.executeQueryAsync(Function.createDelegate(this,this.OnSuccess), Function.createDelegate(this,                 this.OnFailure));
  }

function OnSuccess()
{

    var Html ='';

    var ListEnumerator = this.oAllListItem.getEnumerator();
Html='<table cellspacing="3" cellpadding="3" border="0"><tr><td>ID</td><td> First Name</td><td> Last Name</td><td> Department</td></tr>';
    while(ListEnumerator.moveNext())
    {
                var oItem = ListEnumerator.get_current();
                var ID= oItem.get_id();
                var title=oItem.get_item('Title');
                var lastName=oItem.get_item('LastName');
                var dept=oItem.get_item('WorkingUnit');
   
   Html += '<tr><td>'+ID+'</td><td>'+title+'</td><td>'+lastName+'</td><td>'+
                    dept+'</td></tr></table>';

  
   }

   document.getElementById('ECMADiv').innerHTML =Html;
 }

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

</script>

No comments:

Post a Comment