3

I am unable to find a people picker control in sharepoint designer.

I am editing my NewForm.aspx that comes in a list "Add a New Item" in SP Designer 2013, added some text below the columns and above the save button i.e. located at bottom of the form. I tried to search for peoplepicker control in the designer given controls but I am unable to find it. Sitting on this for a long time and couldn't find it

Help is appreciated!!

4

You can do in two way

Option 1 Client Side

<%@ Register Tagprefix="SharePoint" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> 

<SharePoint:ScriptLink name="clienttemplates.js" runat="server" LoadAfterUI="true" Localizable="false"/>
<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"/>
<SharePoint:ScriptLink name="sp.js" runat="server" LoadAfterUI="true" Localizable="false"/>
<SharePoint:ScriptLink name="sp.runtime.js" runat="server" LoadAfterUI="true" Localizable="false"/>
<SharePoint:ScriptLink name="sp.core.js" runat="server" LoadAfterUI="true" Localizable="false"/>

Add the below javascript to your code on your page

<script type="text/javascript">
      $(document).ready(function () {

          // Specify the unique ID of the DOM element where the// picker will render.
          initializePeoplePicker('peoplePickerDiv');
      });

      function initializePeoplePicker(peoplePickerElementId) {

          var schema = {};
          schema['PrincipalAccountType'] = 'User,DL,SecGroup,SPGroup';
          schema['SearchPrincipalSource'] = 15;
          schema['ResolvePrincipalSource'] = 15;
          schema['AllowMultipleValues'] = true;
          schema['MaximumEntitySuggestions'] = 50;
          schema['Width'] = '280px';
          schema['Height'] = '55px';

          this.SPClientPeoplePicker_InitStandaloneControlWrapper(peoplePickerElementId, null, schema);
      }

      function getUserInfo() {

          var peoplePicker = this.SPClientPeoplePicker.SPClientPeoplePickerDict.peoplePickerDiv_TopSpan;

          var users = peoplePicker.GetAllUserInfo();
          var userInfo = '';
          for (var i = 0; i < users.length; i++) {
              var user = users[i];
              for (var userProperty in user) {
                  userInfo += userProperty + ':  ' + user[userProperty] + '<br>';
              }
          }
         // $('#resolvedUsers').html(userInfo);

          var keys = peoplePicker.GetAllUserKeys();
         // $('#userKeys').html(keys);
          document.getElementById('<%=RandomList.ClientID%>').value =keys ;
      }




</script>

Add this div in the place you want the control

<div id="peoplePickerDiv" style="height: 22px" >

  </div> 

Reference:- https://msdn.microsoft.com/en-us/library/office/jj713593.aspx

Option 2 :- Server Side

Add this code in your .ascx page

<SharePoint:PeopleEditor ID="spPeoplePicker" runat="server" Width="350" SelectionSet="User" />

You can also refer to link below. it is showing same problem you have now. there is no difference to take PeoplePicker in SP 2010 and SP 2013.

http://social.technet.microsoft.com/Forums/en-AU/sharepoint2010programming/thread/7ce91149-e3d7-4178-8c10-4a87e7352197

http://spobject.blogspot.com/2013/02/clientpeoplepicker-in-sharepoint-2013.html

  • This is the "good" people picker, right? The one which predicatively shows matching users? – Rothrock Dec 31 '15 at 21:57
  • Yes It is and you can see it is documented by MSDN that too Microsoft Official documentation – Milind Dec 31 '15 at 22:00
  • I can't figure out where to put the first bit of code. In designer all the code is locked down and I can't edit it. If I try and place that code in the editable regions (inside the <ZoneTemplate> tags it all blows up. – Rothrock Dec 31 '15 at 22:30
  • First of all hats of you for working on New Year eve. Next right click on the file make it check out then edit in advance Then you can do – Milind Dec 31 '15 at 22:33
  • Thanks. Likewise. Happy New Year to you too! We can't checkout or ghost/unghost (whichever) the forms. I got around that part of the problem by putting them on the masterpage -- just a test site for now. I do get a good people picker, but it isn't connected to the list item that I'm editing (or I assume I was creating if I were using it on a NewForm). How do I say, "This people picker is linked to the AssignedTo column in this list."? – Rothrock Dec 31 '15 at 22:46

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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