Enable\Disable Ribbon button by Users Group Sharepoint 2010

In this post we will see a detailed example of how to enable and disable a ribbon button according to the Logged in user’s group. The idea here is to enable the ribbon button if the current user is a part of a pre-specified group (say ListOwners) and disable the same if the user is not one of the added users of the group.

The example uses “EnabledScript” attribute of the CommandUIHandler of the ribbon button to decide whether the button should be enabled or disabled for the loggedin user.

Code Overview -

1.  The below example enables the ribbion button if the current user is a part of a pre-specified group (say ListOwners)

2. The button remains\gets disabled if the user does not exist in the specified group.

3. A separate JavaScript file CheckUserInGroup.js which is deployed in /_layouts/RibbonScripts contains the EnableIfUserInGroup() function. This function is called in EnabledScript and it executes to check if the user exists in the pre-specified group.

Lets Start with creating a Ribbon button first  -

Steps -

1. Create a empty project.

2. Deploy it as a Farm solution.

3. Right click on the feature and click “Add feature”.

4. Right click on the project and add a new “Empty Element” item.

5. Next add the below code to add a custom Ribbon button to your document library.

<Elements xmlns=”http://schemas.microsoft.com/sharepoint/” >
<CustomAction
Id=”ButtonForGroupUsersOnly”
Location=”CommandUI.Ribbon”
RegistrationId=”101″
RegistrationType=”List”
Title=”Owners Group Button”>
<CommandUIExtension>
<CommandUIDefinitions>
<CommandUIDefinition
Location=”Ribbon.Library.ViewFormat.Controls._children”>
<Button Id=”Ribbon.Library.ViewFormat.UsersBtn”
Command=”usersBtnCommand”
LabelText=”Group Users Button”
Image32by32=”/_layouts/1033/IMAGES/buttonIcon.jpg”
TemplateAlias=”o1″ />
</CommandUIDefinition>
</CommandUIDefinitions>
<CommandUIHandlers>
<CommandUIHandler
Command=”usersBtnCommand”
CommandAction=”javascript:OwnerBtnscript();“/>  –> Refer Your Function here. This runs after your button is clicked
EnabledScript=”javascript:EnableIfUserInGroup();” -> Enable Ribbon function here
</CommandUIHandlers>
</CommandUIExtension>
</CustomAction>

//Referencing the Script
<CustomAction
Id=”OwnersButton.Script”
Location=”ScriptLink”
ScriptSrc =”/_layouts/RibbonScripts/CheckUserInGroup.js”/>
</Elements>

The Group Users Button created in the above code will be in the disabled mode on page load. The code inEnableIfUserInGroup(); will determine if the current  user is added to the specified group and the button needs to be enabled.

The CustomAction ScriptLink refers to the path of the CheckUserInGroup.js file which containsEnableIfUserInGroup(); and other JavaScript functions.

6. Next add a Javascript file in your project “CheckUserInGroup.js” and add it under Layouts -> RibbonScripts folder. Create Layouts folder using Add-> “Sharepoint Layouts Mapped Folder” .

7. Next, the following goes in your CheckUserInGroup.js file

<script src=”/_layouts/SP.js” type=”text/ecmascript”></script>
<script type=”text/javascript”>

// The below is called by EnabledScript in ribbon button
function EnableIfUserInGroup() {
var _userInGroup;

if (UserExistInGroup == null)
CheckUser();
else {
_userInGroup = UserExistInGroup;
UserExistInGroup = null;
return _userInGroup;
}
}

// The below checks if the user exists in the group

function CheckUser()
{
var clientContext = new SP.ClientContext();
var groupCollection = clientContext.get_web().get_siteGroups();

// Get the Our Group’s ID
var _group = groupCollection.getById(10); ->> ID of the Group that we are checking against e.g. ListOwners group
var users = _group.get_users(); ->> Get all Users of the group
clientContext.load(_group);
clientContext.load(users,’Include(loginName)’);

this._currentUser = clientContext.get_web().get_currentUser(); ->> Get current user
clientContext.load(this._currentUser,’Include(loginName)’);

clientContext.executeQueryAsync(Function.createDelegate(this, this.onQuerySucceeded), Function.createDelegate(this, this.onQueryFailed));
RefreshCommandUI(); ->> Refreshes the Ribbon again to pick up the new value for UserExistInGroup
}

//The below Checks  if User is the member of the specified group
function onQuerySucceeded() {
if(users.count >0)
{
UserExistInGroup = false;

for(var i=0; i < users.count; i++)
{
if(users[i].get_loginName() == this._currentUser.get_loginName())
{
UserExistInGroup = true;
}
}
}}

function onQueryFailed(sender, args) {
alert(‘Request failed. ‘ + args.get_message() + ‘\n’ + args.get_stackTrace());
}
</script>

8. Next Build and deploy.