Quick Summary

Learn how to automatically populate user details in SharePoint NewForm.aspx using a Script Editor Web Part with jQuery and SPServices.

Pre-populating a Current User's Display Name, Username, or First Name - Last Name in the People Picker field of NewForm.aspx is much harder than it should be.

Your method varies depending on whether your form is an out of the box (i.e. NewForm.aspx) or customised SharePoint form (i.e. a new form page created in SharePoint Designer).

This post describes how to pre-populate user details on an out of the box NewForm.aspx using a Script Editor Web Part. If you have customised your page in SharePoint Designer, see the customised form approach.

InfoPath Alternative

If you are an InfoPath Developer then setting the Current User Details in an InfoPath Form is a straightforward process. Well as long as your SharePoint Installation is on-premise.

SharePoint Online Limitation

If you are using SharePoint Online, there is a workaround for finding user details in an Office 365 InfoPath Form, though this method is not nearly as powerful.

Set username on NewForm.aspx with Script Editor Web Part

To pre-populate user details on an out of the box SharePoint NewForm.aspx page follow these instructions.

Step 1: Download jQuery SPServices

Download the latest jquery SP Service (i.e. jquery.SPServices-0.5.3.min.js) then upload your jquery file to your Site Assets library.

Step 2: Prepare the Script

Copy the script below and paste it into Notepad:

<script src="https://ajax.microsoft.com/ajax/jQuery/jquery-1.4.2.min.js" type="text/javascript"></script>
<script src="/sites/MySharePointSite/SiteAssets/jquery.SPServices-0.5.3.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
  var loginName= $().SPServices.SPGetCurrentUser();
  SetUserFieldValue("Requested By",loginName);

function SetUserFieldValue(fieldName, userName) {
    var _PeoplePicker = $("div[title='" + fieldName + "']");
    var _PeoplePickerTopId = _PeoplePicker.attr('id');
    var _PeoplePickerEditer = $("input[title='" + fieldName + "']");
    _PeoplePickerEditer.val(userName);
    var _PeoplePickerOject = SPClientPeoplePicker.SPClientPeoplePickerDict[_PeoplePickerTopId];
    _PeoplePickerOject.AddUnresolvedUserFromEditor(true);
  }
});
</script>

Update line 2: Change MySharePointSite to point to jquery in your SharePoint Site Assets library.

Update line 5: Change "Requested By" to the name of the people picker field in your form. Type the field label exactly here (e.g. Manager Name, or Approved By etc).

Implementation Steps

Navigate to NewForm.aspx

Go to the NewForm.aspx page (you can get there by clicking the New button).

Edit the Page

Click Settings Cog → Edit page

Add Web Part

Click Add a Web Part

Select Script Editor

Choose Media and Content → Script Editor, then click Add

Insert Script

Click Edit Snippet, paste in your code, and click Insert

Save Changes

Select the Page Ribbon, then click Stop Editing

Success!

Now when a user creates a New Form, their username will populate in the Requested By people picker field.

Troubleshooting

Not working? Have you got a Custom NewForm Page?

If you have customised your NewForm.aspx page in SharePoint Designer, check out the approach for pre-populating Current User on a customised MyNewForm.aspx page.

Key Benefits

  • Saves user time on form completion
  • Reduces data entry errors
  • Works with out-of-the-box forms
  • Easy to implement

Requirements

  • jQuery library
  • SPServices library
  • Script Editor Web Part
  • Edit page permissions

Need Help with SharePoint Form Customization?

Our SharePoint experts can help you implement user pre-population scripts and customize SharePoint forms for better user experience.