User Profiles basically contain information (Manager, WorkEmail, workPhone,Department and etc.) about the person in the organization.

Create SharePoint Controls as mentioned below.
  1. Name (People or Person)
  2. E-Mail (Single Line of Text)
  3. Phone Number (Single Line of Text)
Add Script Editor webpart into NewForm.apsx page and write the below code into script editor webpart.

  1. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
  2. <script type="text/javascript" src="/_layouts/15/SP.js"></script>
  3. <script type="text/javascript" src="/_layouts/15/SP.UserProfiles.js"></script>
  4. <script src="//cdnjs.cloudflare.com/ajax/libs/jquery.SPServices/2014.01/jquery.SPServices.min.js"></script>
  6. $(document).ready(function (){
  8. $("input:text").focus(function(){
  9. var userId = $("span.ms-entity-resolved").attr("ID"); // People Picker Reference
  10. userId=userId.replace(/\\/g,'\\');
  11. userId = userId.split("|")[1]; // Splitting User ID
  12. $().SPServices({
  13. operation: "GetUserProfileByName",
  14. async: false,
  15. AccountName: userId,
  16. completefunc: function (xData, Status) {
  17. workEmail = getUPValue(xData.responseXML, "WorkEmail"); //Fetching Email ID
  18. workPhone = getUPValue(xData.responseXML, "WorkPhone"); //Fetching Phone Number
  19. }
  20. });
  21. $("input[title='E-Mail']").val(workEmail); // Appending Email ID with TextField
  22. $("input[title='Phone Number']").val(workPhone); // Appending Phone Number with TextField
  23. });
  25. });
  27. function getUPValue(x, p) {
  28. var thisValue = $(x).SPFilterNode("PropertyData").filter(function() {
  29. return $(this).find("Name").text() == p;
  30. }).find("Values").text();
  31. return thisValue;
  32. }
In the below screen, EMail and Phone Field Values get auto populated onfocus of any control in the form.