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.
   
   
   
   
5. Add a field called Test as a single line of text.
   
   
   
   
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.
   
   
   
   
9. Click on Add a Webpart and add 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
   
   
   
   
2. 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.