How to set and get people picker fields of a list using REST API?

Question

How to set and get people picker fields of a list using REST API

Answer 1

To get people field try below code:

//Here users is a people of group field
var users = [];
$.ajax({
        url: _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/getbytitle('employees')/items?$select=Users/Title,Users/Id,Users/EMail,Users/FirstName,Users/LastName,Users/EMail&$expand=Users",
        method: "GET",
        headers: { "Accept": "application/json; odata=verbose" },
        success: function (data) {
            console.log(data);
            var items = data.d.results;
            if (items.length > 0) {
                for (var i=0; i < items.length; i++) {
                    var firstname, lastname, email, name, profileId, profileLink = "";
                    name = items[i].Users.Title;
                    if (name != undefined) {
                        firstname = items[i].Users.FirstName;
                        lastname = items[i].Users.LastName;
                        email = items[i].Users.EMail;
                        name = items[i].Users.Title;
                        profileId = items[i].Users.Id;
                        profileLink = "/sites/YourSiteCollection/_layouts/userdisp.aspx?ID=" + profileId;
                    users.push({
                        &quot;title&quot;: title,
                        &quot;name&quot; : name,
                        &quot;firstname&quot; : firstname,
                        &quot;lastname&quot; : lastname,
                        &quot;email&quot; : email,
                        &quot;profileId&quot; : profileId,
                        &quot;profileLink&quot; : profileLink
                    });
                }
            }
        }
    },
    error: function (data) {
        console.log(data);
    }

});

To use the values from the array:

function useValues() {
    var html = "<table>"
    for (var i=0; i < users.length; i++) {
        var name = users[i].name;
        var profileLink = users[i].profileLink;
        var email = users[i].email;
        html += "<tr><td><a href='" + profileLink + "'>" + name + "</a></td></tr>";
        html += "<tr><td><a href='mailto:" + email + "'>" + email + "</a></td></tr>";
    }
    html += "</table>";
    return html;
}

To add the item, try it as below:

//Create a item
var itemProperties = {
    '__metadata' : { 'type': 'SP.Data.employeesListItem' },
    'Title': 'Test',
    'Users' : { 'results': [_spPageContextInfo.userId] } //add current user 
};
$.ajax({

       url: _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/getbytitle('employees')/items",

       type: "POST",

       processData: false,

       contentType: "application/json;odata=verbose",
       data: JSON.stringify(itemProperties),
       headers: {

          "Accept": "application/json;odata=verbose",
          "X-RequestDigest": $("#__REQUESTDIGEST").val()
       },
       success:function(data){
            console.log(data);
       },
       error:function(data){
            console.log(data);
       }
    });

Reference - add value to people field 2013

Answer 2

To get value of People Picker using REST API

URL: SiteURL + /_api/web/lists/getbytitle('List Display Name')/items$expand=Author&$select=Author/Id,Title

Author: People Picker column in list

To Set value in People Picker field in form

You will need user email or login name and use below code

var divPeople = SPClientPeoplePicker.SPClientPeoplePickerDict.PeoplePickerDiv_TopSpan;
//PeoplePickerDiv_TopSpan - Specify the unique ID of the DOM element where the picker will render.

var userObj = { 'Key': "sample@sample.com" };

divPeople.AddUnresolvedUser(userObj, true);

To set value People picker field in list using REST API

var addNewItemUrl = "/_api/Web/Lists/GetByTitle('SpTest')/Items"; 

var data = {
    __metadata: { 'type': 'SP.Data.SpTestListItem' },
    AuthorId: 3,
};

addNewItem(addNewItemUrl,data);

function addNewItem(url, data) {
    $.ajax({
        url: _spPageContextInfo.webAbsoluteUrl + url,
        type: "POST",
        headers: {
            "accept": "application/json;odata=verbose",
            "X-RequestDigest": $("#__REQUESTDIGEST").val(),
            "content-Type": "application/json;odata=verbose"
        },
        data: JSON.stringify(data),
        success: function (data) {
            console.log(data);
        },
        error: function (error) {
            alert(JSON.stringify(error));
        }
    });
}

Note: For multi value people picker column pass int array inside people piker field.

EDIT: URL: SiteURL + /_api/web/lists/getbytitle('List Display Name')/items$expand=Author&$select=Author/Id,Title There should be a "?" after /items

URL: SiteURL + /_api/web/lists/getbytitle('List Display Name')/items?$expand=Author&$select=Author/Id,Title