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.