Sharepoint 2013 - EditForm, people picker new value not saving

问题

I have used below code to Add value in people picker. The code works fine in NewForm.aspx. But when I edit the people picker in EditForm.aspx it doesnt take the new value. It saves the old value only.

function SetNewPeoplePicker(controlName, Username) {
var ppDiv = jQuery("[id$='ClientPeoplePicker'][title='" + controlName + "']");      
var ppEditor = ppDiv.find("[title='" + controlName + "']"); 
var spPP = SPClientPeoplePicker.SPClientPeoplePickerDict[ppDiv[0].id];          
ppEditor.val(Username);                 // Set the value
spPP.AddUnresolvedUserFromEditor(true);                 // Resolve the User if (!spPP.HasInputError) 
{
        var userKeys = spPP.GetAllUserInfo();
        var myUser = userKeys[0];
        Manager = myUser.AutoFillDisplayText;
}
spPP.SetEnabledState(false);
jQuery('a.sp-peoplepicker-delImage').hide();

}

I read that we have to change webpart properties to "Server Rendering". But the whole UI changes and my code written in JS for other field fails.

Can anyone please provide a solution.

回答1:

Since you are using SharePoint 2013 I would recommend you to consider the following approach. In SharePoint 2013 was introduced a so called Client Rendering Mode (CSR) which is intended for rendering of List Views and Forms using HTML and JavaScript and which is a default rendering mode.

How to initialize User field in New/Edit forms using CSR

Below example demonstrates how to initialize User field (AssignedTo field in Tasks List) in New & Edit forms:

Template code:

(function () {
    var ctx = {};
    ctx.Templates = {};
    ctx.Templates.Fields = {
        'AssignedTo': {
            'NewForm': renderPeoplePickerWithDefaultValue,
            'EditForm': renderPeoplePickerWithDefaultValue
        }
    };
    SPClientTemplates.TemplateManager.RegisterTemplateOverrides(ctx);
})();

function renderPeoplePickerWithDefaultValue(ctx) {
     //1.set user field value
     var loginName = String.format('i:0#.f|membership|{0}',_spPageContextInfo.userLoginName);  //set to current user login name
     var displayName = $('div#SuiteNavUserName').text();   //set to current user display name 
     var userEntry = createUserEntity(loginName,displayName);
     ctx.CurrentFieldValue = [];   //Note: it is assumed the user field is a multi-valued field (!)
     ctx.CurrentFieldValue.push(userEntry);
     //2.render default People Picker  
     return SPClientPeoplePickerCSRTemplate(ctx); 
}

function createUserEntity(loginName,displayName)
{
   return {
      Description: loginName,
      DisplayText: displayName,
      EntityGroupName: "",
      EntityType: "",
      HierarchyIdentifier: null,
      IsResolved: true,
      Key: loginName,
      MultipleMatches: [],
      ProviderDisplayName: "",
      ProviderName: ""
   };
}

P.S.: in the specified example AssignedTo field is set to current user, in order to specify another user, modify loginName and displayName parameters.

P.P.S. The example has been tested in SharePoint Online

How to apply the changes

There are at least two options how to apply the changes:

Using JSLink property
Place JavaScript template on page via Script Editor/Content Editor web parts

Here is how to apply the changes using the second option:

Switch the page (NewForm.aspx) into edit mode
Add Script Editor webpart right below the list view web part.
Put the specified code by wrapping it using script tag code into the Script Editor, for example: <script type="text/javascript">{Template JS code goes here}</script>
Save the page

Results

References

INTRODUCTION TO CLIENT-SIDE RENDERING IN SHAREPOINT 2013
SharePoint 2013 Client Side Rendering: List Views

来源：https://stackoverflow.com/questions/27519795/sharepoint-2013-editform-people-picker-new-value-not-saving

标签

jquery

sharepoint

sharepoint-2013