Initialize
$(document).ready(function () { // Specify the unique ID of the DOM element where the picker will render. jk.initializePeoplePicker('peoplePickerDiv'); }); var jk={}; jk.initializePeoplePicker=function (peoplePickerElementId) { // Create a schema to store picker properties, and set the properties. var schema = {}; schema['PrincipalAccountType'] = 'User'; schema['SearchPrincipalSource'] = 15; schema['ResolvePrincipalSource'] = 15; schema['AllowMultipleValues'] = false; schema['MaximumEntitySuggestions'] = 50; //schema['Width'] = '280px'; schema['OnUserResolvedClientScript'] = 'jk.GetUser'; SPClientPeoplePicker_InitStandaloneControlWrapper(peoplePickerElementId, null, schema); } jk.GetUser=function(topElementId, users){ var peoplePickerId=topElementId.split("_")[0]; //var peoplePicker = SPClientPeoplePicker.SPClientPeoplePickerDict[topElementId]; if(users.length>0){ if(users[0].IsResolved){ var loginName=users[0].Key; var userName=users[0].DisplayText; jk.userName[peoplePickerId]=userName; jk[peoplePickerId]={}; jk[peoplePickerId].userName=userName; jk[peoplePickerId].loginName=loginName; jk[peoplePickerId].email=users[0].EntityData.Email; jk.GetUserId(peoplePickerId,loginName); } //add user to group //var approverGroup=af.getGroupName("Approver"); //$pnp.sp.web.siteGroups.getByName(approverGroup).users.add(loginName); } } jk.GetUserId=function(peoplePickerId,loginName){ $pnp.sp.web.ensureUser(loginName).then(function (user) { var u = user; jk.loginName[peoplePickerId]=user.data.Id; jk[peoplePickerId].userId=user.data.Id; }); }
Add user
var userField = $("#Admin_TopSpan_EditorInput").get(0); var peoplepicker = SPClientPeoplePicker.PickerObjectFromSubElement(userField); peoplepicker.AddUserKeys(loginName);
Remove users
var spclientPeoplePicker = SPClientPeoplePicker.SPClientPeoplePickerDict[_PeoplePickerTopId]; if (spclientPeoplePicker) { //Get the Resolved Users list from Client People Picker var ResolvedUsers = $(document.getElementById(spclientPeoplePicker.ResolvedListElementId)).find(“span[class=’sp-peoplepicker-userSpan’]”); //Clear the Client People Picker $(ResolvedUsers).each(function (index) { spclientPeoplePicker.DeleteProcessedUser(this); }); }