Determine Whether Or Not a User Belongs to a Particular Group In SharePoint 2013 Using jQuery

Hide a field in SharePoint list if the current logged in user belongs to a specific group in SharePoint 2013 using jQuery.

Introduction

This article explains how to hide a field in SP2013 if the current logged in user belongs to a group.

Prerequisites

  1. Ensure you have a SharePoint site.
  2. jQuery JavaScript Library v1.8.3
  3. SPServices - Version 0.7.2 jquery

Scenario

Hide a field in SharePoint list if the current logged in user belongs to a specific group.

Use the following procedure:

  1. In our example we shall create a group and list that contains a field.
  2. Create a group called “Test Group”.
  3. Add your account to the group.
  4. Create a custom list called called Test.

    custom list

  5. Add a field called Test as a single line of text.

    Test

  6. Now navigate to the NewForm.aspx page.
  7. Syntax: http://yoursitecollection/Lists/ListName/NewForm.aspx

    In our example : http://yoursitecollection/Lists/Test/NewForm.aspx
     
  8. Goto settings and edit the page.

    settings and edit the page

  9. Click on Add a Webpart and add Content Editor Webpart.

    Content Editor Webpart

  10. Now add a reference to jQuery JavaScript Library v1.8.3 and SPServices - Version 0.7.2 jquery file.
     

    <script type="text/javascript" src="/ sites/Devsite /SPServices.0.7.2.js"></script>

    <script type="text/javascript" src="/sites/Devsite/jqueryv1.8.3.js"></script>
     

  11. Now add the following lines of code:
     

    <script type="text/javascript">

        $(document).ready(function () {

            //get the field object

            var testField = $("input[id^=Test]");

     

            $().SPServices({

                operation: "GetGroupCollectionFromUser",

                userLoginName: $().SPServices.SPGetCurrentUser(),

                async: false,

                completefunc: function (xData, Status) {

                    var xml = xData.responseXML.xml;

                    if ($(xData.responseXML).find("Group[Name='Test Group']").length == 1) {

                        //current user belongs to group

                        testField.parent().parent().parent().hide();

                    }

                }

            });

        });</script>
     

  12. Now click on ok and stop editing the webpart.
  13. That's it!
  14. Now let's start testing.

Testing

  1. Before adding the CEWP

    adding the CEWP

  2. After Adding CEWP webpart

    After Adding CEWP webpart

Summary

Thus in this article you saw how to hide a field based on a group in SharePoint 2013 using jQuery.

Up Next
    Ebook Download
    View all
    Learn
    View all