SharePoint – Auto-Fill fields using jQuery and SPServices


Hello everyone. Today I want to show you how you can use jQuery and SPServices (Javascript) to automatically fill fields of SharePoint Forms based on the current user. This can be used to reduce the time users need to fill out forms and to prevent re-entering data you already have.

Unfortunately you need to fulfill all of the following prerequisites before you can begin:

  • SharePoint Server (When you use SharePoint Server 2010 you need an Enterprise License)
  • User Profile Service Application up and running with some Profiles in it (For example: Imported from Active Directory)
  • Download jQuery
  • Download SPServices

After I downloaded all necessary scripts I created a new Document Library called “Script” and added a column (Single line of text) called “Script_Version” to store the version of the scripts (This way I can keep track of the current version and do not need to update my scripts each time a new version is published).

sharepoint_auto_fill_scripts_library

After that I created a new Custom List called “Test” (Not very creative I know). And I added the following columns:

  • LastName (Single line of text)
  • FirstName (Single line of text)
  • Department (Single line of text)
  • EmployeeNumber (Single line of text)
  • Manager (Person or Group)

sharepoint_auto_fill_test_library

Now you need to update the New Form of your Custom List. To edit the New Form enter the following URL into your Browser:

http://<SharePoint-Site>/Lists/listname/NewForm.aspx?PageView=Shared&ToolPaneView=2

Now add a Content Editor Webpart to the page.

sharepoint_add_script_to_new_form

Now add a link pointing to the AutoFillFields.js to the Content Link textbox of your Content Editor Webpart and hide it so your users will not see it when the open up a New Form. When you are finished click on OK and save your work by clicking on Stop Editing.

sharepoint_add_script_to_new_form_content_editor

Here is the code of the AutoFillFields.js Javascript file you need to make this example work:


<script language="javascript" src="/sites/test/Script/jquery.min.js" type="text/javascript"></script>

<script language="javascript" src="/sites/test/Script/jquery.SPServices.min.js" type="text/javascript"></script>

<script language="javascript" type="text/javascript">

$(document).ready(function() {

//Get and Set Department
var userDepartment = $().SPServices.SPGetCurrentUser({

fieldName: "Department"

});

$("input[Title='Department']").val(userDepartment);

//Get and Set LastName
var userLastName = $().SPServices.SPGetCurrentUser({

fieldName: "LastName"

});

$("input[Title='LastName']").val(userLastName);

//Get and Set FirstName
var userFirstName = $().SPServices.SPGetCurrentUser({

fieldName: "FirstName"

});

$("input[Title='FirstName']").val(userFirstName);

//Get and Set Manager (People or Group field)
var columnName = 'Manager';

var managerName;
$().SPServices({
operation: "GetUserProfileByName",
async: false,
AccountName: $().SPServices.SPGetCurrentUser(),
completefunc: function (xData, Status) {
$(xData.responseXML).find("PropertyData > Name:contains('Manager')").each(function() {
managerName = $(this).parent().find("Values").text();
});
}
});

var searchText = RegExp("FieldName=\"" + columnName + "\"", "gi");

$("td.ms-formbody").each(function() {

if(searchText.test($(this).html())) {
$(this).find("div[Title='People Picker']").html(managerName);
return false;
}
});

//Get and Set EmployeeNumber (Custom user property)
var employeeNumber;
$().SPServices({
operation: "GetUserProfileByName",
async: false,
AccountName: $().SPServices.SPGetCurrentUser(),
completefunc: function (xData, Status) {
$(xData.responseXML).find("PropertyData > Name:contains('EmployeeNumber')").each(function() {
employeeNumber = $(this).parent().find("Values").text();
});
}
});

$("input[Title='EmployeeNumber']").val(employeeNumber);

});

</script>

As always you can download my script from here.

The screenshot below shows you that I have added my List as a Webpart to my default page (To show you that this script does also work when the List itself is used as a Webpart).

sharepoint_auto_fill_fields_page

The next step for me was to sign in as a user who has a profile in my User Profile Store (For example: I created a user profile for Lisa Simpson). After I clicked on Add new item (and waiting for about 1-2 seconds) a New Form opened up with all fields I defined in my script already filled out.

sharepoint_new_form_auto_filled_fields

That´s it. You now have the power to fill out fields beforehand to make your users happy 🙂

Sources:

http://www.dhirendrayadav.com/2010/08/modify-newformaspx-and-editformaspx-add.html

http://sympmarc.com/2010/03/16/set-a-people-pickers-value-on-a-form-revisited-with-jquery/

http://sympmarc.com/2010/10/29/capturing-the-current-users-manager-in-moss-using-spservices-and-getuserprofilebyname/

http://basquang.wordpress.com/2010/09/21/spservices-using-jquery-to-auto-fill-current-user-information-in-sharepoint-2010/

 

Advertisements
Tagged ,

24 thoughts on “SharePoint – Auto-Fill fields using jQuery and SPServices

  1. What’s Happening i’m new to this, I stumbled upon this I have found It absolutely useful and it has aided me out loads.
    I’m hoping to contribute & aid other customers like its aided me.
    Great job.

  2. I am extremely impressed with your writing talents as
    well as with the format on your weblog. Is that this a paid topic or did you modify it yourself?
    Anyway keep up the excellent quality writing, it is rare to peer a nice blog like this one these days..

    • theezitguy says:

      I´m glad you like my writing, thank you. I always try to write short and simple explanations so everyone can understand (It is sometimes not so simple for me since some topics are a bit difficult and I am not a native speaker).

      It is not a paid topic. I wanted to share my knowledge about this topic so others can benefit from it.

  3. Aids And Hiv says:

    My brother recommended I might like this web site. He used
    to be totally right. This submit actually made my day.
    You can not imagine just how a lot time I had
    spent for this info! Thanks!

  4. Please let me know if you’re looking for a article writer for your blog.
    You have some really good articles and I feel I
    would be a good asset. If you ever want to take
    some of the load off, I’d really like to write some content for your blog in exchange for a link back to mine.
    Please blast me an email if interested. Regards!

  5. What’s up it’s me, I am also visiting this web site daily, this
    site is in fact pleasant and the visitors are in fact sharing pleasant thoughts.

  6. With havin so much content and articles do you ever run into any issues of plagorism or copyright infringement?

    My blog has a lot of unique content I’ve either created myself or outsourced but it seems a lot of it is popping it up all over the internet without my authorization.
    Do you know any methods to help protect against content from being stolen? I’d really appreciate it.

  7. Thanks for sharing such a pleasant idea, article is good,
    thats why i have read it fully

  8. No matter if some one searches for his required thing, thus he/she wishes to be available that in detail, thus that thing is maintained over here.

  9. Hey! This is my first visit to your blog! We are a group
    of volunteers and starting a new initiative in a community in the same niche.
    Your blog provided us useful information to work on. You
    have done a wonderful job!

  10. URL says:

    … [Trackback]

    […] Informations on that Topic: theezitguy.wordpress.com/2014/05/26/sharepoint-auto-fill-fields-using-jquery-and-spservices/ […]

  11. I comment whenever I like a post on a site or if I have
    something to valuable to contribute to the conversation.
    Usually it’s a result of the fire communicated in the article I
    read. And on this post SharePoint – Auto-Fill fields using jQuery and SPServices | theezitguy.

    I was excited enough to post a thought 😉 I actually do have a couple of questions for you if it’s allright.
    Could it be just me or do some of the remarks look as if they
    are coming from brain dead individuals? 😛 And,
    if you are writing on other online sites, I’d
    like to keep up with everything fresh you have to post.

    Would you make a list all of your public sites like your Facebook page, twitter feed, or linkedin profile?

  12. Fantastic beat ! I wish to apprentice while you amend your
    website, how could i subscribe for a blog web site?
    The account helped me a acceptable deal. I had been a little bit acquainted of this your broadcast provided bright clear concept

  13. grqdfkqehs says:

    SharePoint – Auto-Fill fields using jQuery and SPServices | theezitguy
    grqdfkqehs http://www.gozf01jt7u9w4mz0a975922064czwa5bs.org/
    [url=http://www.gozf01jt7u9w4mz0a975922064czwa5bs.org/]ugrqdfkqehs[/url]
    agrqdfkqehs

  14. I am sure this article has touched all the internet users, its really really pleasant post on building up
    new web site.

  15. I do not even know how I ended up here, but I thought this post was
    great. I don’t know who you are but certainly you
    are going to a famous blogger if you are not already 😉 Cheers!

  16. Bas says:

    I always find it frustrating to see numerous solutions but with short description and lack of samples to lead the way. I am so glad to see a blog for the first time with clear description of how you can get to the solution from scratch. Not only that but you were generous enough to provide the sample which I also find lacking in most blogs. Oh one other think I noticed reviewing these comments – you care enough to respond.

    Keep up the good work and never change.

  17. ... says:

    … [Trackback]

    […] Read More: theezitguy.wordpress.com/2014/05/26/sharepoint-auto-fill-fields-using-jquery-and-spservices/ […]

  18. […] how you can use jQuery and SPServices to Auto-Fill fields. Please follow the instructions in this post but use the script below instead in your NewForm.aspx and/or EditForm.aspx […]

  19. Daniella says:

    Hello! Someone in my Facebook group shared this website
    with us so I came to give it a look. I’m definitely
    enjoying the information. I’m bookmarking and will be tweeting this to my followers!
    Excellent blog and great style and design.

  20. Jim Shelley says:

    Hey – real SharePoint Developer here. Thank you for this easy tutorial. Can’t believe it’s got so many spam comments.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: