Hi is there anyway to manipulate PeoplePicker using JSOM. How tho get or set value of PeoplePicker using JavaScript


3 Answers 3


This Code perfectly works on SharePoint 2013.

References To be added:

<SharePoint:ScriptLink name="clientforms.js" runat="server" LoadAfterUI="true" Localizable="false"/>
<SharePoint:ScriptLink name="clientpeoplepicker.js" runat="server" LoadAfterUI="true" Localizable="false"/>
<SharePoint:ScriptLink name="autofill.js" runat="server" LoadAfterUI="true" Localizable="false"/>

<script type="text/javascript" src="../SiteAssets/jquery-1.11.1.js"></script>
<script type="text/javascript" src="../SiteAssets/SPReferences/MicrosoftAjax.js"></script>
<script type="text/javascript" src="../SiteAssets/SPReferences/sp.runtime.js"></script>
<script type="text/javascript" src="../SiteAssets/SPReferences/sp.js"></script>

JSOM Code:

    function SetPeoplePicker_Multiselect(peoplePickerElementId, allowMultiple){
        if (allowMultiple == null) {
            allowMultiple = true;
        var schema = {};
        schema['PrincipalAccountType'] = 'User,DL,SecGroup,SPGroup';
        schema['SearchPrincipalSource'] = 15;
        schema['ResolvePrincipalSource'] = 15;
        schema['AllowMultipleValues'] = allowMultiple;
        schema['MaximumEntitySuggestions'] = 50;
        schema['Width'] = '';
        SPClientPeoplePicker_InitStandaloneControlWrapper(peoplePickerElementId, null, schema);


<span id="peoplePickerspanId"> </span>
  • Perfectly worked for me...thanks.!.. you saved my Day..:) Commented Mar 12, 2015 at 9:29

You can use jQuery selectors to do this.

You need to locate the people picker using selectors and pass the values or get the values.

For example, My people picker control is placed inside a <td> with id "peoplePicker" then I could use the following code to locate and get or set values

get values

var people=$("#peoplePicker").find("div[role='TextBox']").text();

set value

var people="testUser";

to verify if the username is exsist or not include the following code after passing the value

  • this may work for now but what if there are tow users with same name there it wont be easy to determine which one did user intended to select Commented Mar 4, 2015 at 9:48

You can use SPServices to interact with people picker

  peoplePickerDisplayName: "",
  valueToSet: "",
  checkNames: true

Reference: http://spservices.codeplex.com/wikipage?title=%24().SPServices.SPFindPeoplePicker

  • Thanks @AnandKrishnan but for some purpose I dont want to use SPServices for now is there a way with JSOM only. Commented Mar 4, 2015 at 5:52

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.