有没有人有一些＆＃34;样板＆＃34;在JavaScript中工作的代码将从SharePoint用户配置文件中撤回当前用户及其经理？我更喜欢使用Rest API，但任何让我获得数据的东西都会很精彩。
我想利用Office 365 SharePoint托管插件中的用户配置文件在用户第一次加载页面时填充3人选择器控件（请求者，收款人和管理器）。可以从我们的SharePoint租户中的当前用户的配置文件信息中检索所有这些人，但每次我尝试获取该信息时，我都会收到禁止或权限问题。我是我们网站上的SharePoint管理员，并添加了在应用程序的AppManifest.xml中设置的读取权限。
<AppPermissionRequests>
<AppPermissionRequest Scope="http://sharepoint/content/tenant" Right="Read" />
</AppPermissionRequests>
我已经在下面给出了JavaScript代码和html，使得People Picker在html页面中工作，但要运行它，您需要使用jQuery和Bootstrap创建一个SharePoint Hosted Add-in。注意：这不是ASP.Net页面，而是html页面。 提前感谢您对此问题的任何帮助。
// 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('requestorDiv');
initializePeoplePicker('payeeDiv');
initializePeoplePicker('managerDiv');
});
// 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(person) {
// Get the people picker object from the page.
var peoplePicker = null;
switch (person.toLowerCase()) {
case 'requestor':
peoplePicker = this.SPClientPeoplePicker.SPClientPeoplePickerDict.requestorDiv_TopSpan;
break;
case 'payee':
peoplePicker = this.SPClientPeoplePicker.SPClientPeoplePickerDict.payeeDiv_TopSpan;
break;
case 'manager':
peoplePicker = this.SPClientPeoplePicker.SPClientPeoplePickerDict.managerDiv_TopSpan;
break;
}
// Get information about all users.
var users = peoplePicker.GetAllUserInfo();
//start new process
var userInfo = '';
var fullName = "";
var email = "";
for (var i = 0; i < users.length; i++) {
var user = users[i];
var firstName = "";
var middleInitial = "";
var lastName = "";
var rawName = user['DisplayText'];
var count = rawName.split(' ').length;
rawName = rawName.split(' ');
firstName = rawName[1];
lastName = rawName[0];
fullName = firstName + " " + lastName;
if (count == 3) {
middleInitial = rawName[2];
fullName = firstName + " " + middleInitial + " " + lastName;
}
for (var userProperty in user) {
userInfo += userProperty + ': ' + user[userProperty] + '<br>';
if (userProperty == 'Description') {
email = user[userProperty].toLowerCase();
}
}
}
$('#resolvedUsers').html(userInfo);
$('#email').html(email);
$('#fullName').html(fullName);
$('#username').html(fullName);
$('#usertype').html(person);
switch (person.toLowerCase()) {
case 'requestor':
$('#input-requestor').val(fullName);
$('#requestorEmail').text(email)
break;
case 'payee':
$('#input-payee').val(fullName);
$('#payeeEmail').text(email)
break;
case 'manager':
$('#input-manager').val(fullName);
$('#managerEmail').text(email)
break;
}
// 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());
}<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title></title>
<link href="../Content/bootstrap.css" rel="stylesheet" />
<link href="../Content/font-awesome.min.css" rel="stylesheet" />
<link rel="stylesheet" type="text/css" href="/_layouts/15/1033/styles/Themable/corev15.css" />
<style>
.modal-title{
font-weight: bold;
font-size: large;
}
</style>
</head>
<body class="container-fluid">
<br />
<form class="form">
<div class="row">
<div class="col-md-2 text-left"><label for="input-requestor" class="topic">Requestor: <i class="text-danger"><strong>*</strong></i> </label></div>
<div class="col-md-2 text-left"><label for="input-payee" class="topic">Payee: <i class="text-danger"><strong>*</strong></i> </label></div>
<div class="col-md-2 text-left"><label for="input-manager" class="topic">Manager: <i class="text-danger"><strong>*</strong></i> </label></div>
</div>
<div class="row">
<div class="col-md-2">
<div class="input-group">
<input type="text" class="form-control" readonly="readonly" placeholder="Person filling out form" id="input-requestor" />
<span class="input-group-btn">
<a class="btn btn-default" data-toggle="modal" data-target="#peopleModal" data-person="Requestor">
<i class="glyphicon glyphicon-user" aria-hidden="true"></i>
</a>
</span>
<input id="requestorEmail" hidden="hidden" />
</div>
</div>
<div class="col-md-2">
<div class="input-group">
<input type="text" class="form-control" readonly="readonly" placeholder="Person getting reimbursement" id="input-payee">
<span class="input-group-btn" title="Get payee">
<a class="btn btn-default" data-toggle="modal" data-target="#peopleModal" data-person="Payee"><i class="glyphicon glyphicon-user"></i> </a>
</span>
<input id="payeeEmail" hidden="hidden" />
</div>
</div>
<div class="col-md-2">
<div class="input-group">
<input type="text" class="form-control" readonly="readonly" placeholder="Approving manager" id="input-manager">
<span class="input-group-btn">
<a class="btn btn-default" data-toggle="modal" data-target="#peopleModal" data-person="Manager"><i class="glyphicon glyphicon-user"></i> </a>
</span>
<input id="managerEmail" hidden="hidden" />
</div>
</div>
</div><!--end of row one-->
</form>
<div class="modal fade" id="peopleModal" tabindex="-1" role="dialog" aria-labelledby="peopleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h3 class="modal-title" id="peopleModalLabel">New message</h3>
<a class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</a>
</div>
<div class="modal-body">
<form>
<div id="requestorDiv"></div>
<div id="payeeDiv"></div>
<div id="managerDiv"></div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button id="okModalButton" type="button" class="btn btn-primary" data-dismiss="modal">Ok</button>
</div>
</div>
</div>
</div>
<script src="../Scripts/jquery-3.3.1.min.js"></script>
<script src="../Scripts/tether.min.js"></script>
<script src="../Scripts/bootstrap.min.js"></script>
<script type="text/javascript" src="/_layouts/15/init.js"></script>
<script type="text/javascript" src="/_layouts/15/MicrosoftAjax.js"></script>
<script type="text/javascript" src="/_layouts/15/1033/initstrings.js"></script>
<script type="text/javascript" src="/_layouts/15/1033/strings.js"></script>
<script type="text/javascript" src="/_layouts/15/SP.UI.Controls.js"></script>
<script type="text/javascript" src="/_layouts/15/clienttemplates.js"></script>
<script type="text/javascript" src="/_layouts/15/clientforms.js"></script>
<script type="text/javascript" src="/_layouts/15/clientpeoplepicker.js"></script>
<script type="text/javascript" src="/_layouts/15/autofill.js"></script>
<script type="text/javascript" src="/_layouts/15/sp.runtime.js"></script>
<script type="text/javascript" src="/_layouts/15/sp.init.js"></script>
<script type="text/javascript" src="/_layouts/15/sp.ui.dialog.js"></script>
<script type="text/javascript" src="/_layouts/15/sp.js"></script>
<script type="text/javascript" src="/_layouts/15/core.js"></script>
<script type="text/javascript" src="/_layouts/15/SP.Core.JS"></script>
<script type="text/javascript" src="../Scripts/App.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#peopleModal').on('show.bs.modal', function (event) {
var button = $(event.relatedTarget); // Button that triggered the modal
var recipient = button.data('person'); // Extract info from data-* attributes
// If necessary, you could initiate an AJAX request here (and then do the updating in a callback).
// Update the modal's content. We'll use jQuery here, but you could use a data binding library or other methods instead.
var modal = $(this);
switch (recipient.toLowerCase()) {
case 'requestor':
$("#requestorDiv").show();
$("#payeeDiv").hide();
$("#managerDiv").hide();
break;
case 'payee':
$("#requestorDiv").hide();
$("#payeeDiv").show();
$("#managerDiv").hide();
break;
case 'manager':
$("#requestorDiv").hide();
$("#payeeDiv").hide();
$("#managerDiv").show();
break;
}
modal.find('.modal-title').text('Find ' + recipient + ' using people picker box below');
modal.find('#okModalButton').click(function () { getUserInfo(recipient) });
});
});
</script>
</body>
</html>
答案 0 :(得分：1)
通过以下脚本设置人员控制默认值。 peoplePickerDiv 与控件ID <div id="peoplePickerDiv"></div>
SPClientPeoplePicker.SPClientPeoplePickerDict.peoplePickerDiv_TopSpan.AddUserKeys(user.get_email());
我的测试项目：
<%-- The following 4 lines are ASP.NET directives needed when using SharePoint components --%>
<%@ Page Inherits="Microsoft.SharePoint.WebPartPages.WebPartPage, Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" MasterPageFile="~masterurl/default.master" Language="C#" %>
<%@ Register TagPrefix="Utilities" Namespace="Microsoft.SharePoint.Utilities" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Register TagPrefix="WebPartPages" Namespace="Microsoft.SharePoint.WebPartPages" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Register TagPrefix="SharePoint" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%-- The markup and script in the following Content element will be placed in the <head> of the page --%>
<asp:Content ContentPlaceHolderID="PlaceHolderAdditionalPageHead" runat="server">
<script type="text/javascript" src="../Scripts/jquery-1.9.1.min.js"></script>
<SharePoint:ScriptLink name="sp.js" runat="server" OnDemand="true" LoadAfterUI="true" Localizable="false" />
<meta name="WebPartPageExpansion" content="full" />
<!-- Add your CSS styles to the following file -->
<link rel="Stylesheet" type="text/css" href="../Content/App.css" />
<!-- Add your JavaScript to the following file -->
<script type="text/javascript" src="../Scripts/App.js"></script>
</asp:Content>
<%-- The markup in the following Content element will be placed in the TitleArea of the page --%>
<asp:Content ContentPlaceHolderID="PlaceHolderPageTitleInTitleArea" runat="server">
Page Title
</asp:Content>
<%-- The markup and script in the following Content element will be placed in the <body> of the page --%>
<asp:Content ContentPlaceHolderId="PlaceHolderMain" runat="server">
<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" />
<div id="peoplePickerDiv"></div>
<div>
<br/>
<input type="button" value="Get User Info" onclick="getUserInfo()"></input>
<br/>
<h1>User info:</h1>
<p id="resolvedUsers"></p>
<h1>User keys:</h1>
<p id="userKeys"></p>
<h1>User ID:</h1>
<p id="userId"></p>
</div>
</asp:Content>
App.js
'use strict';
ExecuteOrDelayUntilScriptLoaded(initializePage, "sp.js");
function initializePage()
{
var context = SP.ClientContext.get_current();
var user = context.get_web().get_currentUser();
// This code runs when the DOM is ready and creates a context object which is needed to use the SharePoint object model
$(document).ready(function () {
getUserName();
});
// This function prepares, loads, and then executes a SharePoint query to get the current users information
function getUserName() {
context.load(user);
context.executeQueryAsync(onGetUserNameSuccess, onGetUserNameFail);
}
// This function is executed if the above call is successful
// It replaces the contents of the 'message' element with the user name
function onGetUserNameSuccess() {
SPClientPeoplePicker.SPClientPeoplePickerDict.peoplePickerDiv_TopSpan.AddUserKeys(user.get_email());
}
// This function is executed if the above call fails
function onGetUserNameFail(sender, args) {
alert('Failed to get user name. Error:' + args.get_message());
}
}
// 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.
SPClientPeoplePicker_InitStandaloneControlWrapper(peoplePickerElementId, null, schema);
}
// Query the picker for user information.
function getUserInfo() {
// Get the people picker object from the page.
var peoplePicker = 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();
var user = context.get_web().ensureUser(loginName);
context.load(user);
context.executeQueryAsync(
function () {
$('#userId').html(user.get_id());
},
function onFail(sender, args) {
alert('Query failed. Error: ' + args.get_message());
}
);
}