Hide and display things if user member of group

Question

i have group, were i have some users, if the current logged in user is a member of my group then display that, if the user is not a member of the group then dont display.

Right now it first says the user is a member of the group then the user is not a member of the group. So if i am signed in with a user that are a member i get the same, or if i am logged in with a user thats not a member, still the same?

I am using CSOM in SharePoint here is my code.

<script>

function IsCurrentUserMemberOfGroup(groupName, OnComplete) {


    var context = new SP.ClientContext.get_current();
    var currentWeb = context.get_web();

    var currentUser = context.get_web().get_currentUser();
    context.load(currentUser);

    var allGroups = currentWeb.get_siteGroups();
    context.load(allGroups);

    var group = allGroups.getByName(groupName);
    context.load(group);

    var groupUsers = group.get_users();
    context.load(groupUsers);

    context.executeQueryAsync(
            function (sender, args) {
                var userInGroup = IsUserInGroup(currentUser, group);
                OnComplete(userInGroup);
            },
            function OnFailure(sender, args) {
                OnComplete(false);
            }
    );

   function IsUserInGroup(user, group) {
         var groupUsers = group.get_users();

        var userInGroup = false;
        var groupUserEnumerator = groupUsers.getEnumerator();
        while (groupUserEnumerator.moveNext()) {
            var groupUser = groupUserEnumerator.get_current();
            if (groupUser.get_id() == currentUser.get_id()) {
                userInGroup = true;
                break;

            }

        }
        OnComplete(userInGroup);
    }
}

function IsCurrentUserMemberOfGroupDisplayNot() {
    IsCurrentUserMemberOfGroup("MycustomGroup", function (isCurrentUserInGroup) {
        if (isCurrentUserInGroup) {
            alert("User is in group");

            jQuery('mydiv').css("display", "block");
        }
        else {

            alert("User is not in group");
            jQuery('mydiv').css("display", "none");
        }


    });


}

ExecuteOrDelayUntilScriptLoaded(IsCurrentUserMemberOfGroupDisplayNot, 'SP.js');

UPDATE

 <script>
 //this make sure the function is called once the page is loaded completely

 _spBodyOnLoadFunctionNames.push(onPageLoad());

 function onPageLoad() {

     ExecuteOrDelayUntilScriptLoaded(checkUser, 'SP.js')

 }
 var adminUsers;

 var vCurrUserName;

 function checkUser() {

     var currentContext = new SP.ClientContext.get_current();

     //get current user

     vCurrUserName = currentContext.get_web().get_currentUser();

     currentContext.load(vCurrUserName);

     // get Admin group

     var groupCollection = currentContext.get_web().get_siteGroups();

     var _group = groupCollection.getByName("MyGroup");

     adminUsers = _group.get_users();

     currentContext.load(adminUsers);

     currentContext.executeQueryAsync(Function.createDelegate(this, this.checkUserSuccess), Function.createDelegate(this, this.checkUserFailure));

 }

 function checkUserSuccess() {

     var vIsAdmin = false;

     var listEnumerator = adminUsers.getEnumerator();


     while (listEnumerator.moveNext()) {

         var item = listEnumerator.get_current();

         alert(item.get_loginName());
         //check current user login name and user login name from admin group

         if (vCurrUserName.get_loginName() == item.get_loginName()) {

             vIsAdmin = true;

             break;

         }



     }

     if (vIsAdmin)
         {alert('is member');}

     else {alert('not member');}
 }

 function checkUserFailure() {
     alert("checkUserFailure");

 }

UPDATE 11:40

My system account are also displayed as member of my group, because he is a member of the owners group, how could i check if current user

if (item.get_isSiteAdmin() == vCurrUserName.get_isSiteAdmin())

Like this then do my else statement

Answer 1

I hope you dont mind but I decided to have a go at writing the code. This is what I came up with using promises.

var ITSP = ITSP || {};
ITSP.SharePoint = ITSP.SharePoint || {};

ITSP.SharePoint.Init = function() {

    var deferred = $.Deferred();
    ITSP.SharePoint.Context = SP.ClientContext.get_current();

    var context = ITSP.SharePoint.Context;

    ITSP.SharePoint.Web = context.get_web();
    context.load(ITSP.SharePoint.Web, 'AssociatedOwnerGroup');

    ITSP.SharePoint.CurrentUser = ITSP.SharePoint.Web.get_currentUser();
    context.load(ITSP.SharePoint.CurrentUser);

    ITSP.SharePoint.SiteGroups = ITSP.SharePoint.Web.get_siteGroups();
    context.load(ITSP.SharePoint.SiteGroups);

    ITSP.SharePoint.CurrentUser.GroupMembership =    ITSP.SharePoint.CurrentUser.get_groups();
    context.load(ITSP.SharePoint.CurrentUser.GroupMembership);

    context.executeQueryAsync(
            function (sender, args) {
                deferred.resolve();
            },
            function OnFailure(sender, args) {
                deferred.resolve();
            }
    );

    return deferred.promise();
}

function IsUserInGroup(user, groupName) {
    var deferred = $.Deferred();
    var checkGroup = user.get_groups().getByName(groupName);

    var context = ITSP.SharePoint.Context;
    context.load(checkGroup);
    context.executeQueryAsync(
        function (sender, args) {
            var userInGroup = false;
            if (checkGroup) {
                userInGroup = true;
            }
            deferred.resolve(userInGroup);
        },
        function (sender, args) {
            var userInGroup = false;
            deferred.resolve(userInGroup);
        }
        );



    return deferred.promise();
}

function GetOwnerWebGroup()
{
    var deferred = $.Deferred();

    var ownerGroup = null;
    ownerGroup = ITSP.SharePoint.Web.get_associatedOwnerGroup();

    var context = ITSP.SharePoint.Context;
    context.load(ownerGroup);
    context.executeQueryAsync(
        function (sender, args) {
            var ownerGroupName = ownerGroup.get_title();
            deferred.resolve(ownerGroupName);
        },
    function (sender, args) {
        var ownerGroupName="";
        deferred.resolve(ownerGroupName);
    });



    return deferred.promise();
}

function ShowElementIfMemberOrAdmin() {


    var elementName = '#mydiv';
    var memberGroupName = "Developer Sandpit Members";

    //hide the element 
    $(elementName).hide();

    //Initialise everything first
    ITSP.SharePoint.Init().done(function () {

        //check is the user site admin or in owners group
        var userIsAdmin = ITSP.SharePoint.CurrentUser.get_isSiteAdmin();
        var userIsMemberOfSiteOwnerGroup = false;
        var userIsMemberOfGroup = false;

        var ownerGroupName = "";

        //use promises to cascade and get all the returns from the checks.
        GetOwnerWebGroup().then(function (groupName) {
            ownerGroupName = groupName;

            return IsUserInGroup(ITSP.SharePoint.CurrentUser, ownerGroupName);
        }).then(function (argument) {
            userIsMemberOfSiteOwnerGroup = argument;
            return IsUserInGroup(ITSP.SharePoint.CurrentUser, memberGroupName);
        }).then(function (argument) {
            userIsMemberOfGroup = argument;

            if (userIsAdmin || userIsMemberOfSiteOwnerGroup || userIsMemberOfGroup) {
                alert("User is either admin or in group");
                $(elementName).show();
            }
            else {

                alert("User is not in group or admin");
                $(elementName).hide();
            }
        });


    });


}

ExecuteOrDelayUntilScriptLoaded(ShowElementIfMemberOrAdmin, 'sp.js');