CSOM:- Programmatically Get SharePoint list person or group column value in SharePoint using CSOM

  public static string GetUserFieldType(ClientContext ctx, FieldUserValue value)
        {
            var objList = ctx.Site.RootWeb.SiteUserInfoList;
            var userInfo = objList.GetItemById(value.LookupId);
            ctx.Load(userInfo, i => i.ContentType);
            ctx.ExecuteQuery();
            return userInfo.ContentType.Name;
        }


  public void  Getpersonorgroupvalue()
            {
 using (ClientContext clientContext = new ClientContext("SiteCollectionUrl"))
            {
                clientContext.Credentials = new NetworkCredential("UserName", "Password", "DomainName");
                Web web = clientContext.Web;
                clientContext.Load(web);
                clientContext.ExecuteQuery();
var list = web.Lists.GetByTitle("ListName");
                CamlQuery camlQuery = new CamlQuery();
                camlQuery.ViewXml = @"<View></View>";
                Microsoft.SharePoint.Client.ListItemCollection lstCollection = list.GetItems(camlQuery);
                clientContext.Load(lstCollection);
                clientContext.ExecuteQuery();
                FieldUserValue[] objfieldvalue = lstCollection[0]["PersonGroupColumnName"] as FieldUserValue[];

   if (objfieldvalue != null && objfieldvalue.Length > 0)
                {
                    for (int UserIndex = 0; UserIndex < objfieldvalue.Length; UserIndex++)
                    {
                        string type = GetUserFieldType(clientContext, objfieldvalue[UserIndex]);
                        break;
                    }
                }
    for (int UserIndex = 0; UserIndex < objfieldvalue.Length; UserIndex++)
                     {
                      string UserId =Convert.ToString(objfieldvalue[UserIndex].LookupValue);
                        break;
                     }

}
              }

Continue Reading...

SharePoint Angular Js :- Add items to SharePoint List using Angular js Example

1.Create a Custom List Name as "Emp" and Create a below Column Name

2.Create one Content Editor WebPart and  paste the below code

   <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"></script>   
<script>   
    function EmpCtrl($scope) {   
   
        $scope.emp = { firstName: "", lastName: "", location: "" };    
        $scope.addEmpInfo = function ($event) {   
            var x = $scope.emp;   
            $event.preventDefault();   
   
            var clientContext = new SP.ClientContext.get_current();   
            var web = clientContext.get_web();   
            var list = web.get_lists().getByTitle('Emp');                 
            var listItemInfo = new SP.ListItemCreationInformation();              
            var listItem = list.addItem(listItemInfo);                
            listItem.set_item('Title', 'Mr');   
            listItem.set_item('FirstName', x.firstName);   
            listItem.set_item('LastName', x.lastName);   
            listItem.set_item('Location', x.location);    
            listItem.update();      
            clientContext.executeQueryAsync(   
                Function.createDelegate(this, onQuerySucceeded),   
                Function.createDelegate(this, onQueryFailed)   
            );   
   
        };   
   
        onQuerySucceeded = function () {   
            alert('Item Added Successfully');   
        }   
   
        onQueryFailed = function (sender, args) {   
            alert('Request failed. ' + args.get_message() + '\n' + args.get_stackTrace());   
        }   
    }   
</script>   
   
   
<h1>Add item to sharepoint list using Angular Js</h1>   
<br />   
<div ng-app="">   
    <div ng-controller="EmpCtrl">   

 <table>
 <tr>
 <td>
    <strong>First Name</strong> 
 </td>
 <td>
     <input type="text" ng-model="emp.firstName" />
 </td>
 </tr>
 
  <tr>
 <td>
     <strong>Last Name</strong> 
 </td>
 <td>
      <input type="text" ng-model="emp.lastName" />
 </td>
 </tr>
 
  <tr>
 <td>
     <strong>Location</strong>
 </td>
 <td>
     <input type="text" ng-model="emp.location" />
 </td>
 </tr>
 <tr>
 <td>
       <input type="submit" value="Save" ng-click="addEmpInfo($event)" />
 </td>
 </tr>
 </table>    
          
    </div>   
</div>  

output:-
               

Continue Reading...

SharePoint Angular Js :- Get items from SharePoint List using Angular js Example

1.Create a Custom List Name as "Emp" and Create a below Column Name

2.Create one Content Editor WebPart and  paste the below code

<script type="text/javascript">
function altRows(id){
if(document.getElementsByTagName){  

var table = document.getElementById(id);  
var rows = table.getElementsByTagName("tr"); 
 
for(i = 0; i < rows.length; i++){          
if(i % 2 == 0){
rows[i].className = "evenrowcolor";
}else{
rows[i].className = "oddrowcolor";
}      
}
}
}
window.onload=function(){
altRows('alternatecolor');
}
</script>

<style type="text/css">
table.altrowstable {
font-family: verdana,arial,sans-serif;
font-size:11px;
color:#333333;
border-width: 1px;
border-color: #a9c6c9;
border-collapse: collapse;
}
table.altrowstable th {
border-width: 1px;
padding: 8px;
border-style: solid;
border-color: #a9c6c9;
}
table.altrowstable td {
border-width: 1px;
padding: 8px;
border-style: solid;
border-color: #a9c6c9;
}
.oddrowcolor{
background-color:#d4e3e5;
}
.evenrowcolor{
background-color:#c3dde0;
}
</style>  
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.min.js"></script>   
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>   
   
<script>   
       
   
    var myAngApp = angular.module('SharePointAngApp', []);   
    myAngApp.controller('spCustomerController', function ($scope, $http) {   
        $http({   
            method: 'GET',   
            url: _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/getByTitle('Emp')/items?$select=FirstName,LastName,Location",   
            headers: { "Accept": "application/json;odata=verbose" }   
        }).success(function (data, status, headers, config) {   
            $scope.customers = data.d.results;   
        }).error(function (data, status, headers, config) {   
          
        });   
    });   
       
   
</script>   

<h1>SharePoint with Angular js Example </h1>   
   
<div ng-app="SharePointAngApp" class="row">   
    <div ng-controller="spCustomerController" class="span10">   
       
         <table class="altrowstable" id="alternatecolor">
            <tr>   
                <th>FirstName</th>   
                <th>LastName</th>   
                <th>Location</th>   
                  
           </tr>   
            <tr ng-repeat="customer in customers">   
               <td>{{customer.FirstName}}</td>   
                <td>{{customer.LastName}}</td>   
               <td>{{customer.Location}}</td>   
               </tr>   
        </table>   
    </div>   
</div>  

output:-
          
          

           

Continue Reading...

SharePoint Knockout js :- Get items from SharePoint List using Knockout js

1.Create a Custom List Name as "Emp" and Create a below Column Name

2.Create one Content Editor WebPart and  paste the below code

<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>   
<script src="https://SiteCollectionUrl/sites/DevSite/Style%20Library/knockout-3.3.0.js"></script>   
<script src="https://SiteCollectionUrl/sites/DevSite/Style%20Library/ko.sp-1.0.min.js"></script>   

<script type="text/javascript"> 
function altRows(id){
if(document.getElementsByTagName){  

var table = document.getElementById(id);  
var rows = table.getElementsByTagName("tr"); 
 
for(i = 0; i < rows.length; i++){          
if(i % 2 == 0){
rows[i].className = "evenrowcolor";
}else{
rows[i].className = "oddrowcolor";
}      
}
}
}
window.onload=function(){
altRows('alternatecolor');
}
</script>

<style type="text/css">
table.altrowstable {
font-family: verdana,arial,sans-serif;
font-size:11px;
color:#333333;
border-width: 1px;
border-color: #a9c6c9;
border-collapse: collapse;
}
table.altrowstable th {
border-width: 1px;
padding: 8px;
border-style: solid;
border-color: #a9c6c9;
}
table.altrowstable td {
border-width: 1px;
padding: 8px;
border-style: solid;
border-color: #a9c6c9;
}
.oddrowcolor{
background-color:#d4e3e5;
}
.evenrowcolor{
background-color:#c3dde0;
}
</style>  

<script>   
   
    ExecuteOrDelayUntilScriptLoaded(MainFunction, "sp.js");   
    var completeEmployeeList = null;   
   
     
    function EmployeeList(title, firstname, lastname, location) {   
        var self = this;   
        self.Title = title;   
        self.FirstName = firstname;   
        self.LastName = lastname; 
        self.Location = location;   
    }   
       
    
    function EmployeeListViewModel() {   
        var self = this;   
       
        self.Employees = ko.observableArray([]);   
        self.AddEmployees = function (title, firstname, lastname, location) {   
            self.Employees.push(new EmployeeList(title, firstname, lastname, location));   
        }   
    }   
   
    function MainFunction() {   
        completeEmployeeList = new EmployeeListViewModel();             
        retrieveListItems();               
        ko.applyBindings(completeEmployeeList);   
    }   
   
    function retrieveListItems() {   
        var clientContext = new SP.ClientContext.get_current();   
        var oList = clientContext.get_web().get_lists().getByTitle('Emp');   
        var camlQuery = new SP.CamlQuery();   
        camlQuery.set_viewXml("<View><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 currentItem = listItemEnumerator.get_current();   
            completeEmployeeList.AddEmployees(currentItem.get_item("Title"), currentItem.get_item("FirstName"), currentItem.get_item("LastName"), currentItem.get_item("Location"));   
        }   
    }   
   
    function onQueryFailed(sender, args) {   
        alert('Request failed. ' + args.get_message() + '\n' + args.get_stackTrace());   
    }   
</script>   
   

<div id="divEmployeeList">   
   
    <h2>SharePoint with Knockout js Example</h2>   
    <br />   
   
  <table class="altrowstable" id="alternatecolor">
        <thead>   
            <tr>   
                <th>Title</th>   
                <th>FirstName</th>    
                <th>LastName</th>    
                <th>Location</th>   
            </tr>   
        </thead>   
        
        <tbody data-bind="foreach: Employees">   
            <tr>   
                <td data-bind="text: Title"></td>   
                <td data-bind="text: FirstName"></td> 
                <td data-bind="text: LastName"></td>    
                <td data-bind="text: Location"></td>   
            </tr>   
        </tbody>   
    </table>   

</div>  

output:- 

    

Continue Reading...