How to restrict Client side people picker not to allow duplicate users?

Question

I am using Client Side People Picker as shown in Use the client-side People Picker control in SharePoint-hosted SharePoint Add-ins.

Now the problem is, this people picker is allowing same user multiple times. I don't want the same user to allow multiple times.

So, is there any workaround how can I restrict same user multiple times in client side people picker?

Answer 1

You can do this by checking On Control Resolved Users Changed event for the Client People picker. Please find more info here for Client People Picker Events.

You can try following script block to check if user is already entered in people picker. Put this script at the end of initializePeoplePicker function definition as defined in your mentioned link

this.SPClientPeoplePicker.SPClientPeoplePickerDict.peoplePickerDiv_TopSpan.OnUserResolvedClientScript = function (peoplePickerId, selectedUsersInfo) {
    console.log('inside OnUserResolvedClientScript');
    var users = selectedUsersInfo;
    for(var i = 0; i < users.length - 1; i++){
        if(users[users.length - 1].Key == users[i].Key){
            alert("User already exists");
            // Do something else...
        }

    }
};