A form input that allows for the choice of one or more people.
Uses the standard sized Persona component.
Use the extra small Persona component to fit more results.
Has a smaller search field.
Presents the selected people in a list below the search field, rather than inline.
If the network is unavailable, you can present an error message in the search more area. @@include('PeoplePicker.Disconnected.html')
<head>
<link rel="stylesheet" href="fabric.min.css">
<link rel="stylesheet" href="fabric.components.min.css">
<script src="jquery-2.2.1.min.js"></script>
<script src="jquery.fabric.min.js"></script>
</head>
<script>
tag to your page, below the references to jQuery and Fabric's JS, to instantiate all Dialog components on the page: <script>
$(document).ready(function() {
if ($.fn.PeoplePicker) {
$('.ms-PeoplePicker').PeoplePicker();
}
});
</script>
This component uses Persona and PersonaCard to display people and Label for the Members List variant. It also uses a Spinner when searching for results.