SharePoint 2013 JavaScript从用户(人员)字段获取价值

时间:2015-05-13 15:19:40

标签: javascript jquery field sharepoint-2013

是否有人成功设法从“新建”或“编辑”表单专门为SharePoint 2013 获取用户(人员或组)字段的值?

我已经尝试了我可以通过搜索互联网找到的所有解决方案以及我能想到的所有内容,所有这些都导致结果为空白或未定义。

我最接近的是以下链接,如果有人感兴趣,后者可以设置值,但我无法成功调整它以检索值。

https://jasonscript.wordpress.com/2013/08/07/javascript-and-working-with-the-sharepoint-2013-people-picker/

http://www.sharepointcolumn.com/sp2013-setting-people-picker-value-in-newform-aspx/

我的目标是只在值为空时设置值,但我无法获得当前值。

在DOM中查找有许多HTML元素,这些元素具有包含值的属性,但使用JQuery检索这些属性导致空白或未定义。我已经确认我有title或id属性的正确对象。有一个HTML元素,其中title属性具有值,在该特定情况下,JQuery仍然返回空白或未定义。

感谢您提供任何帮助。

2 个答案:

答案 0 :(得分:2)

由于您使用的是SharePoint 2013,我建议您考虑以下方法。在SharePoint 2013中引入了一个所谓的Client Rendering Mode (CSR),用于使用HTML和JavaScript 呈现列表视图和表单,它是默认呈现模式

如何使用CSR

初始化新建/编辑表单中的用户字段

下面的示例演示如何在&中初始化任务列表中的用户字段(AssignedTo字段)。 编辑表单:

  

注意:假设用户字段是多值字段

模板代码:

SP.SOD.executeFunc("clienttemplates.js", "SPClientTemplates", function() {
    SPClientTemplates.TemplateManager.RegisterTemplateOverrides({

      Templates: {
           Fields: {
               "AssignedTo": {
                   EditForm: renderAssignedTo,
                   NewForm: renderAssignedTo
               }
           }
      }

    });

});


function renderAssignedTo(ctx)
{
    var defaultAssigneeTo = {'LoginName': 'i:0#.f|membership|jdoe@contoso.onmicrosoft.com','DisplayName':'John Dow' };


    if(ctx.CurrentFieldValue.length == 0) /* Is user field value empty? */
    { 
        var userEntry = createUserEntity(defaultAssigneeTo.LoginName,defaultAssigneeTo.DisplayName);
        ctx.CurrentFieldValue = [];   //Note: it is assumed the user field is a multi-valued field (!)
        ctx.CurrentFieldValue.push(userEntry);
    }
    return SPClientPeoplePickerCSRTemplate(ctx); 
}

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

如何应用更改

如何应用更改至少有两个选项:

  1. 使用JSLink property
  2. 通过Script Editor / Content Editor在页面上放置JavaScript模板 网页零件
  3. 以下是使用第二个选项

    应用更改的方法
    1. 将页面(NewForm.aspx)切换为编辑模式
    2. 在列表视图Web部件正下方添加Script Editor webpart。
    3. 将指定的代码用script标记代码包装到脚本编辑器中,例如:<script type="text/javascript">{Template JS code goes here}</script>
    4. 保存页面
    5. 结果

      图片1.新表单页面

      enter image description here

      参考

答案 1 :(得分:0)

我知道我为时已晚,但是只是为了帮助其他人在使用默认人员选择器时遇到相同的问题,因此我在此处记录我的代码。要在PeoplePicker更改事件上调用我们自己的JavaScript函数,我们需要在PeoplePicker字段上附加OnUserResolvedClientScript事件。

$(document).ready(function(){
  SP.SOD.executeFunc("sp.js", "SP.ClientContext", function () {
    SP.SOD.registerSod('clienttemplates.js', SP.Utilities.Utility.getLayoutsPageUrl('clienttemplates.js'));
    SP.SOD.registerSod('clientforms.js', SP.Utilities.Utility.getLayoutsPageUrl('clientforms.js'));
    SP.SOD.registerSod('clientpeoplepicker.js', SP.Utilities.Utility.getLayoutsPageUrl('clientpeoplepicker.js'));
    SP.SOD.executeFunc('clientpeoplepicker.js', "SPClientPeoplePicker", function () {
        GetPeoplePicker('<Field Name>'); //for required field append the fieldName with 'Required Field' text

     });
   });
});

function GetPeoplePicker(fieldName) { 
var controlName = fieldName;     
var peoplePickerDiv = $("[id$='ClientPeoplePicker'][title='" + controlName + "']");  
var peoplePickerEditor = peoplePickerDiv.find("[title='" + controlName + "']");  
var spPeoplePicker = SPClientPeoplePicker.SPClientPeoplePickerDict[peoplePickerDiv[0].id];   
spPeoplePicker.OnUserResolvedClientScript = function (peoplePickerId, selectedUsersInfo) {
    console.log('inside OnUserResolvedClientScript:'+ peoplePickerId);
    console.log(selectedUsersInfo);

  };    

  var userInfo = GetUserInfo(spPeoplePicker); 
}

下面是从PeoplePicker字段获取用户的功能

function GetUserInfo(peoplePicker) {
// Get the people picker object from the page.
var userInfo = [];
if (typeof peoplePicker != 'undefined' && peoplePicker !== null) {
    // Get information about all users.
    var users = peoplePicker.GetAllUserInfo();
    userInfo =users;
    for (var i = 0; i < users.length; i++) {
        var user = users[i];            
        //logic for selected users
    }
  }
  return userInfo;
}

快乐编码:)