Rodrigo Romano – MVP SharePoint Server

Registros de um Especialista SharePoint :)

SharePoint Apps: Como utilizar o People Picker?

leave a comment »


Olá SharePointers,

Hoje vou falar sobre como utilizar o People Picker quando estamos desenvolvendo uma app para SharePoint.

O primeiro passo, é carregar os scripts que serão utilizados (ver imagem abaixo) e colocar a div quer será utilizada para criação do controle dinamicamente.

image

 

Após a criação dos controles acima, basta colocar o código abaixo em um arquivo .js e adicioná-lo a página como referência que o People Picker funcionará perfeitamente.

 

// Run your custom code when the DOM is ready. $(document).ready(function () { // Specify the unique ID of the DOM element where the // picker will render. initializePeoplePicker('peoplePickerDiv'); }); // Render and initialize the client-side People Picker. function initializePeoplePicker(peoplePickerElementId) { // Create a schema to store picker properties, and set the properties. var schema = {}; schema['PrincipalAccountType'] = 'User,DL,SecGroup,SPGroup'; schema['SearchPrincipalSource'] = 15; schema['ResolvePrincipalSource'] = 15; schema['AllowMultipleValues'] = true; schema['MaximumEntitySuggestions'] = 50; schema['Width'] = '280px'; // Render and initialize the picker. // Pass the ID of the DOM element that contains the picker, an array of initial // PickerEntity objects to set the picker value, and a schema that defines // picker properties. this.SPClientPeoplePicker_InitStandaloneControlWrapper(peoplePickerElementId, null, schema); } // Query the picker for user information. function getUserInfo() { // Get the people picker object from the page. var peoplePicker = this.SPClientPeoplePicker.SPClientPeoplePickerDict.peoplePickerDiv_TopSpan; // Get information about all users. 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); // Get user keys. var keys = peoplePicker.GetAllUserKeys(); $('#userKeys').html(keys); // Get the first user's ID by using the login name. getUserId(users[0].Key); } // Get the user ID. function getUserId(loginName) { var context = new SP.ClientContext.get_current(); this.user = context.get_web().ensureUser(loginName); context.load(this.user); context.executeQueryAsync( Function.createDelegate(null, ensureUserSuccess), Function.createDelegate(null, onFail) ); } function ensureUserSuccess() { $('#userId').html(this.user.get_id()); } function onFail(sender, args) { alert('Query failed. Error: ' + args.get_message()); }

Bem simples, não acharam?

 

Abraços! 😀

 

Referência

http://msdn.microsoft.com/en-us/library/jj713593.aspx

Advertisements

Written by Rodrigo Romano

August 11, 2014 at 9:47 am

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: