SharePoint Online: Get User's(People picker) Manager name and email id

Question

I am on SharePoint Online environment. I have 3 columns Author(People picker, only people, no groups), Manager Name(text field) and Manager email(text field).

When a user fills out the Author column which is a people picker, I want to populate the Managers Name and Managers email id of that particular Author(not current logged in user) from Active Directory, before submitting/saving the form. If the Author field is changed/updated, I want the Managers Name and Managers email updated accordingly.

Please suggest?

Thanks

Answer 1

The following code for your reference. Modify the field name in the code and add the code into script editor web part in new form page.

<script src="https://code.jquery.com/jquery-1.12.4.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
    var dispTitle = "Author";
    var managerNameField="Manager Name";
    var managerEmailField="Manager email";      
    var pickerDiv = $("[id$='ClientPeoplePicker'][title='" + dispTitle + "']");      
    var peoplePicker = SPClientPeoplePicker.SPClientPeoplePickerDict[pickerDiv[0].id];
    peoplePicker.OnUserResolvedClientScript=function (peoplePickerId, selectedUsersInfo) {       
        if (selectedUsersInfo[0]) {
            $("input[title='"+managerNameField+"']").val("");
            $("input[title='"+managerEmailField+"']").val("");
            var accountName = selectedUsersInfo[0].Key;
            getProfile(accountName).done(function(data){
                var manager=data.d.GetUserProfilePropertyFor;
                if(manager!=""){                     
                    getMangerProfile(manager).done(function(user){
                        $("input[title='"+managerNameField+"']").val(user.d.DisplayName);
                        $("input[title='"+managerEmailField+"']").val(user.d.Email);

                    });
                }           
            });
        } else {
            //alert("Please Enter Employee Name");
        }
    };     
});
function getProfile(accountName) {
    return $.ajax({
        url: _spPageContextInfo.webAbsoluteUrl + "/_api/SP.UserProfiles.PeopleManager/GetUserProfilePropertyFor(accountName=@v,propertyName='Manager')?@v='"+encodeURIComponent(accountName)+"'",
        type: "GET",
        headers: {
            "Accept": "application/json;odata=verbose",
        }        
    });
}
function getMangerProfile(accountName) {
    return $.ajax({
        url: _spPageContextInfo.webAbsoluteUrl + "/_api/SP.UserProfiles.PeopleManager/GetPropertiesFor(accountName=@v)?@v='"+encodeURIComponent(accountName)+"'",
        type: "GET",
        headers: {
            "Accept": "application/json;odata=verbose",
        }        
    });
}
</script>

Answer 2

You can get the User Object from the people picker in SharePoint. Since this example is in C#, I would suggest putting this into an EventReciever for the NewItem.aspx/EditItem.aspx pages and overridding the default submit for the page. Hide these fields on the form, and just have the information loaded once the new/edit form is saved. You can show it in the view of the list. Try this example below to get the information. The code will change just a bit for update, but you should be able to do that:

For a new item:

private void GetUserInfo() {
    string siteUrl = SPContext.Current.Web.Url;
    PeopleEditor myPicker = myPickerId; //ASP ID Given to your PeoplePicker on the page

    try 
    {
        SPSecurity.RunWithElevatedPrivileges(delegate()
        {
            using (SPSite spSite = new SPSite(siteUrl))
            {
                using (SPWeb spWeb = spSite.Open())
                {
                    var picker = spWeb.EnsureUser(myPicker.CommaSepatartedAccounts);
                    String userName = picker.Name; //this is going to be the UserProfile Name
                    String userEmail = picker.Email;
                    String userID = picker.ID;
                    SPList spList = spWeb.List["YourListName"];
                    SPListItem spListItem = spList.Items.Add();

                    try 
                    {
                        spListItem["Name"] = userName;
                        spListItem["ID"] = userID;
                        spListItem["Email"] = userEmail;
                    }
                    catch (Exception ex) 
                    {
                        Console.WriteLine(ex.InnerException);
                    }
                }
            }
        }
    }
    catch (Exception ex) 
    {
        Console.WriteLine(ex.InnerException);
    }
}

You could try this on the client end. I hae only been able to pull the innerHTML from the PeoplePicker object in JavaScript. I am not sure it is going to have all of the information you are looking for. you cna get it this way on the client end:

var peoplePicker = $("div[title$='People Picker']");
peoplePickerValue = peoplePicker[0].innerHTML;

You can loop through that and see what you are going to be able to pull from it. Hope this at least gives you a good ides on what to do if it does not work like you are wanting to. Good luck!