Sharepoint - How Can I Use the SharePoint People Picker Control in my Custom Web Part?
I found a solution for this problem.
below code should be added to ascx file
<%@ 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
<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>
i found the answer at http://msdn.microsoft.com/en-us/library/jj713593.aspx
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
In SharePoint 2013 there is a new control for selecting people and group. This is the ClientPeoplePicker control. Here is a post how to use it : http://spobject.blogspot.com/2013/02/clientpeoplepicker-in-sharepoint-2013.html