How to make PeoplePicker a required field?
Question
I have a form with a couple PeoplePickers and I'd like to require the user to make a selection for the people picker, but unlike a text box field, I can't figure out how to require a peoplepicker. Appreciate any help/suggestions...
<div class="form-group row">
<div class="col-sm-6">
<label for="peoplePickerUser" class="required">Requestor</label>
<div id="peoplePickerUser"></div>
</div>
</div>
function resolvePeoplePicker() {
var peoplePickerUser= this.SPClientPeoplePicker.SPClientPeoplePickerDict.peoplePickerUser_TopSpan;
this.SPClientPeoplePicker.SPClientPeoplePickerDict.peoplePickerUser_TopSpan.OnUserResolvedClientScript = function (peoplePickerId, selectedUsersInfo) {
///all kinds of code for finding the id's from the people picker
}
}
La solution
You can check if the people picker field is filled or not on click of your form Submit like below:
var peoplePickerElement = SPClientPeoplePicker.SPClientPeoplePickerDict.peoplePickerUser_TopSpan;
var usersList = peoplePickerElement.GetAllUserInfo();
if(usersList.length) {
console.log("Users added");
}
else {
alert("This field is required!");
return;
}
If there are no users then you can show some message to add the users in people picker field.
Autres conseils
You can use below code.
Note: Here through the line $("[title='Requester']").attr("id")
, we are getting th ID of the people picker control whose title is Requester
.
So You can Replace Requester
with the title of your people picker control. And It will work ..
if(SPClientPeoplePicker.SPClientPeoplePickerDict[$("[title='Requester']").attr("id")].GetAllUserInfo().length == 0){
// people picker is empty
}else{
// people picker is NOT empty
}
Licencié sous: CC-BY-SA avec attribution
Non affilié à sharepoint.stackexchange