How to make a people picker field editable using Javascript

Question

Hi All,
I wrote an javascript which populates current loggedin user name on to an people picker, which is working fine,
   But its making the people picker field as readonly, i want this field to be editable so that i can add more users with the current loggedin user name already populated in the newform.aspx
below is the script what i have written
<script src="/_catalogs/masterpage/MashreqMasterpage/scripts/jquery-1.5.1.min"></script><script type="text/javascript" src="/_catalogs/masterpage/MashreqMasterpage/scripts/jquery.SPServices-0.7.1a.min.js"></script><script
type="text/javascript">
 $(document).ready(function() {
     var user= $().SPServices.SPGetCurrentUser({fieldName: "Title"});
      $("div[title='Name']").text(user);
</script>
please help, thanks in advance

Answer 1

Hi,
Please modify your code a bit as below, it won’t make the people picker control read only after setting a value:
var controlName = "MyPersonField";
// Select the People Picker DIV
var ppDiv = $("[id$='ClientPeoplePicker'][title='" + controlName + "']");
// find the <input> under pp DIV
var ppEditor = ppDiv.find("[title='" + controlName + "']");
// Get the instance of the People Picker from the Dictionary
var spPP = SPClientPeoplePicker.SPClientPeoplePickerDict[ppDiv[0].id];
ppEditor.val(user);
spPP.AddUnresolvedUserFromEditor(true);
Best regards
Patrick Liang
TechNet Community Support