Populate People Picker with user Line Manager

9 5 10.9K

When i am developing forms for applications, i like to have as much information on the new item form as possible. Workflow can update the item after submission but I think it adds to the user experience to see important information on the form. Whether it is a unique reference number as described here: Ensure Unique Reference On New Item‌ or other information.

Another piece of important information, especially in an application that requires line manager approval is, yep, you guessed it, the line manager.

With Nintex Forms People Picker API, described in detail here: People Picker Extensions - Nintex Forms‌ we can add the line manager to the people picker control,

In my example i have an employee people picker field default to current user and a Client ID JavaScript variable name of varCurrentUser

I have a manager people picker field with a Client ID JavaScript variable name of varLineManager

Add this code to the custom JavaScript section of form settings

NWF.FormFiller.Events.RegisterAfterReady(function () {
    NWF$(document).ready(function () {

function GetLineManager() {
    //Get current user
    var currentUser = NWF$('#' + varCurrentUser).val();
    //get line manager
    var lineManager = NWF$('#' + varLineManager).val();
    //check line mananger is empty
    if (lineManager == '') {
        //remove claim
        currentUser = currentUser.replace('i:0#.w|', '');
        //remove additional semi colon
        currentUser = currentUser.replace(';', '');
        //encode user name
        currentUser = encodeURI(currentUser);
        //REST call to get the manager property of current user
        var requestUri = _spPageContextInfo.webAbsoluteUrl + '/_api/sp.userprofiles.peoplemanager/getuserprofilepropertyfor(accountname=@v,%20propertyname=\'Manager\')?@v=\'' + currentUser + '\'';
        try {
                url: requestUri,
                type: 'GET',
                headers: { 'ACCEPT': 'application/json;odata=verbose' },
                success: GetLineManagerSuccess,
                error: GetLineManagerError
        catch (err) {
            jQuery('#errorMsg').html('getListData Error: ' + err);

function GetLineManagerSuccess(data) {
    //get line manager
    var lineManager = data.d.GetUserProfilePropertyFor;
    //new people picker instance
    var lineManagerPicker = new NF.PeoplePickerApi('#' + varLineManager);
    //search for line manager
    lineManagerPicker.search(lineManager).done(function (data) {
        //add line manager to people picker field

function GetLineManagerError(sender, args) {
    $get("results").innerHTML = "Error: " + args.get_message();

This will now populate the Line Manager on the new form based on the default value of the current user.

This code can be adapted to populate a people picker value when another value is entered rather than just when the form loads.

Hope this can help someone