Client People Picker is newly introduced in SharePoint 2013. People picker is a SharePoint Control to browse and select the sharepoint users or groups in an organisation or Active Directory. The client people picker is an HTML and JavaScript control that provides cross-browser support.

A client side People picker has the following four components.

1. An input text box – To Enter names for users, groups, and claims.
2. A span control  -To Show the names of resolved users, groups, and claims.
3. A hidden div element – To autofills a drop-down box.
4. An autofill control.

In this article , I will discuss about the clearing the Client Side People Picker using jquery. Below is the code to clear the client side people picker.

// Get the instance of the People Picker from the Dictionary

var spclientPeoplePicker = SPClientPeoplePicker.SPClientPeoplePickerDict[_PeoplePickerTopId]; 

if (spclientPeoplePicker) {

//Get the Resolved Users list from Client People Picker
var ResolvedUsers = $(document.getElementById(spclientPeoplePicker.ResolvedListElementId)).find(“span[class=’sp-peoplepicker-userSpan’]”);

//Clear the Client People Picker

$(ResolvedUsers).each(function (index) {

spclientPeoplePicker.DeleteProcessedUser(this);

});
}

 Please read the below interesting articles on

How to set the Client People Picker value in SharePoint 2013.

Retrieving Query Results by Date Range in SharePoint Site 2013 Using REST SEARCH API

Share you SharePoint Site to External User in SharePoint Online /Office 365

Delete List in Sharepoint 2013/Office 365 using CSOM

Delete ContentTypes in Sharepoint 2013/Office 365 using CSOM

Apply-site-logo-in-office-365-using-csom-code

Hope the above article helps someone!! Happy Blogging!! Happy SharePointing 🙂