How to set multiple values into a client side people picker - sharepoint

Question

i have a list with a people picker column which takes multiple inputs.I have a form created using content editor web part in which i have a client side people picker how to set multiple values into a client side people picker using jsom

Answer 1

Normally you define client people control in HTML:
<div id="control" title="Users" spclientpeoplepicker="true"></div>
Then you need to initialize it.
To initialize it properly you need to assure that these javascripts files are loaded: autofill.js, clienttemplates.js, clientforms.js, clientpeoplepicker.js
JavaScript set control value code:
Entities are validate automatically with function AddUserKeys
var userField = $("input[id$='ClientPeoplePicker_EditorInput']").get(0); // simplified user control search, real word scenario, first search proper row in your form
var peoplepicker = SPClientPeoplePicker.PickerObjectFromSubElement(userField);
peoplepicker.AddUserKeys("Login1"); // or display name
peoplepicker.AddUserKeys("Login2");
JavaScript init control code:
SP.SOD.loadMultiple(['autofill.js', 'clienttemplates.js', 'clientforms.js', 'clientpeoplepicker.js'], registerControls);
function registerControls() {
initPeoplePicker('control');
}
function initPeoplePicker (id, user) {
// 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'] = '311px';
// use code below to init controls with selected user
/*
var users = new Array(1);
var defaultUser = {};
defaultUser.AutoFillDisplayText = user.Value;
defaultUser.AutoFillKey = user.get_loginName();
defaultUser.Description = user.get_email();
defaultUser.DisplayText = user.get_title();
defaultUser.EntityType = "User";
defaultUser.IsResolved = true;
defaultUser.Key = user.get_loginName();
defaultUser.Resolved = true;
users[0] = defaultUser;
*/
// 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(id, null/*users*/, schema);
}