When creating my "Sharepoint Hosted" App for Office365 (15) I had to use the client-side People Picker control in the App Part. There doesn't appear to be much in the way of documentation for this control other than the "How to" MSDN document here:
How to: Use the client-side People Picker control in apps for SharePoint
I wanted to default the control to the current user. From the document I could tell that there was a parameter in the init function that should contain an array of initial PickerEntity objects, but sadly no example of this. The example code simply passed a null where this should be.
SPClientPeoplePicker_InitStandaloneControlWrapper(peoplePickerElementId, null, schema);
I like to use the jQuery deferred function with the SharePoint asynchronous requests so that I have some control over my code executing in a sequential manner.
Here is a snippet of code that demonstrates how to default the People Picker control to the current user:
$(document).ready(function () { SP.SOD.executeFunc('sp.js', 'SP.ClientContext', sharePointReady); }) function sharePointReady() { context = new SP.ClientContext.get_current(); web = context.get_web(); getUser().done(function (user) { var schema = {}; schema['PrincipalAccountType'] = 'User,DL,SecGroup,SPGroup'; schema['SearchPrincipalSource'] = 15; schema['ResolvePrincipalSource'] = 15; schema['AllowMultipleValues'] = false; schema['MaximumEntitySuggestions'] = 50; schema['Width'] = '280px'; var users = new Array(1); var defaultUser = new Object(); defaultUser.AutoFillDisplayText = user.get_title(); defaultUser.AutoFillKey = user.get_loginName(); defaultUser.Description = user.get_email(); defaultUser.DisplayText = user.get_title(); defaultUser.EntityType = "User"; defaultUser.IsResolved = true; defaultUser.Key = user.get_loginName(); defaultUser.Resolved = true; users[0] = defaultUser; SPClientPeoplePicker_InitStandaloneControlWrapper('peoplePickerDiv', users, schema); }); } function getUser() { var dfd = $.Deferred(function () { user = web.get_currentUser(); context.load(user); context.executeQueryAsync( function () { dfd.resolve(user); }), function () { dfd.reject(args.get_message()); }; }); return dfd.promise(); }
5 comments:
This information is very helpful! I have been able to set up a client-side people picker in my sharepoint app form. But now, how should I retrieve the value that has been set? I need to take the value and update it to a list on the side (the list is not hosted in the app, in case that makes a difference) so how does that work?
Awesome post. I especially liked how you managed to prepopulate the picker with a default value. The MSDN docs did not cover that. Great job!
Thanks for this; just a question : how to save the people picker value in a person or group field of a SP list? I not find how to retrieve the id of the user
Very clever!
I am trying to do this in the context of Client Side Rendering.
I want to prepopulate the people picker in a new form. The rub is how to initialize the people picker in the template override.
When I figure it out I'll post the solution.
my blog
Nicee share
Post a Comment