Hide button based on user logged in

Hi

I have three buttons in the form.

The first button (Submit) should only show if the current logged in user is "Created by" and other two buttons (Approve and Reject) should show if the logged in user's matches with the people picker field "Supervisor".

Is there any way we can achieve the same?

Hello @Rinu,

Yes, you can show/hide buttons dynamically on form load. For this, first, you need to give buttons unique CSS classes, e.g. show-author and show-supervisor.
image

Add 'Created by' field to the form to get its data. And add this code to JavaScript editor:

fd.spRendered(function() {
    //hide buttons and Craeted By field on form load
    $('.show-supervisor').hide();
    $('.show-author').hide();
    $(fd.field('Author').$parent.$el).hide();
    
    //Current user name
    var currentUserName = _spPageContextInfo.userDisplayName;

    if(fd.field('Supervisor').value.DisplayText == currentUserName) {
        //show buttons for Supervisor
        $('.show-supervisor').show();
    }
    else if(fd.field('Author').value.displayName == currentUserName) {
        //show buttons for the author
        $('.show-author').show();        
    }
});

Make sure that you are using the internal names of the fields in the code.

1 Like

Hello @Rinu,
This is another way you can use if you have separate groups for users,

var web = new Web('{SIteURL}');

  web.currentUser.get()

    .then(function (user) {

      web.siteUsers.getById(user.Id).groups.get()

        .then(function (groupsData) {

          for (var i = 0; i < groupsData.length; i++) {

            if (groupsData[i].Title == 'Institute Users') {

              //alert("Institute Users");

             

              fd.field('Mylogin').$on('change', function (value) {

                if (value != "") {

                  fd.field('Contracts').disabled = false;

                }

               
              });

            }

            else if (groupsData[i].Title == 'HR Group') {

               fd.field('Contracts').disabled = true;

            }

          }

        });

    }); 

The above code will check current users group, and it also validates that if the value in 'Mylogin' is empty button will disable.

Hope you find useful...!

1 Like

Hi,

Is there a way to hide or show approve and reject buttons when you have a multiple user people picker (but will only be one user) and if that user is = to the logged in user it will only show or hide button?

Dear @Dina_Louw,
Sure, you can use code like this:

fd.spRendered(function() {
    function hideOrShowButton() {
        if (fd.field('Persons').value[0].EntityData.Email == _spPageContextInfo.userEmail) {
            // Show the button
            $(fd.control('Button').$el).show();
        } else {
            // Hide the button
            $(fd.control('Button').$el).hide();
        }
    }

    // Calling hideOrShowButton when the Persons value changes
    fd.field('StartDate').$on('change',hideOrShowButton);

    // Calling hideOrShowButton on form loading
    hideOrShowButton();
});
1 Like

Thank you - I have a different type of issue and it seems quite big and very tricky.
I have one form for Approvers but with 3 approvers approving it and also having general users opening in edit form.
I want my normal user to only see the data/Info that was logged by created by. Then I have a comment field1, approve1 and decline1 button for first line manager and the form needs to check whether the manager is the logged in user to only display his comment and approval buttons (manager sees all info), but I do not want him to see the second and third approver comments or buttons. Then I have a comment field2, approve2 button and decline2 button for second approver and the form needs to check whether the second approver is the logged in user to only display his comment and approval buttons (manager sees all info), but I do not want him to see the first manager buttons and third approver comments or buttons. Same applies with the third manager. My code works for normal users and first line manager. I cannot get the second manager to only see his comments and his buttons.... Therefore I have not moved on to the third approver yet....

The second I take the something out in the //hide buttons and Craeted By field on form load section then any manager can see the button.... Can you please help me?

fd.spRendered(function() {
    debugger;
    //hide buttons and Craeted By field on form load
    $('.Approve').hide();
    $('.Reject').hide();
    $('.Comments_x0020_TM').hide();
    $('.Approve2').hide();
    $(fd.field('Comments_x0020_DC').$parent.$el).hide();
    fd.field('SAP_x0020_OSS_x0020_Details').disabled = true;
    
    //Current user name
    //var i => i.EntityData.Email = _spPageContextInfo.userLoginName;

    if (fd.field('Team_x0020_Manager').value.map( i => i.email ).includes( _spPageContextInfo.userLoginName )) {
        //show buttons for Supervisor
        $('.Approve').show();
        $('.Reject').show();
        $('.Comments_x0020_TM').show();
        fd.field('SAP_x0020_OSS_x0020_Details').disabled = true;
    }
    else if (fd.field('_x0032_nd_x0020_Approver').value.map( i => i.email ).includes( _spPageContextInfo.userLoginName )) {
        //show buttons for the author
        $('.Approve2').show();
        $('.Reject2').show();
        $(fd.field('Comments_x0020_DC').$parent.$el).show();
        fd.field('SAP_x0020_OSS_x0020_Details').enable = true;
    }
});

Dear @Dina_Louw,
Are you sure the conditions are correct? You can try checking it with alert() messages first.

If conditions are correct for each approver - check browser's console for errors.

For example, what does this line do?
fd.field('SAP_x0020_OSS_x0020_Details').enable = true; - I don't think there is enable property.

Hi Nikita, it is a comment field.

What I am trying to do is display certain fields based on the log in user (eg, approve, decline button, fill in fields based on the logged in user = to two different approver person/group fields. The first user is a first line approver and the second is a final approver. The information is on one form set as there is not a group for the users, reason being that the first line user can be anyone and second user is pulled through via a list.

Dear @Dina_Louw,
Not sure if it works or not, but if the conditions work for you, I don't see what the problem is, you can run it like this:

fd.spRendered(function() {
    debugger;
    //hide buttons and Craeted By field on form load
    $('.Approve').hide();
    $('.Reject').hide();
    $('.Comments_x0020_TM').hide();
    $('.Approve2').hide();
    $('.Reject2').hide();
    $(fd.field('Comments_x0020_DC').$parent.$el).hide();
    fd.field('SAP_x0020_OSS_x0020_Details').disabled = true;
    
    //Current user name
    //var i => i.EntityData.Email = _spPageContextInfo.userLoginName;

    if (fd.field('Team_x0020_Manager').value.map( i => i.email ).includes( _spPageContextInfo.userLoginName )) {
        //show buttons for Supervisor
        alert('Supervisor');
        $('.Approve').show();
        $('.Reject').show();
        $('.Comments_x0020_TM').show();
    }
    else if (fd.field('_x0032_nd_x0020_Approver').value.map( i => i.email ).includes( _spPageContextInfo.userLoginName )) {
        //show buttons for the author
        alert('Author');
        $('.Approve2').show();
        $('.Reject2').show();
        $(fd.field('Comments_x0020_DC').$parent.$el).show();
        fd.field('SAP_x0020_OSS_x0020_Details').disabled = false;
    }
});

If you don't see even the alert messages, then the conditions are incorrect.

1 Like

Everything is working for the Team Manager, but it is not working for the 2nd Approver..... I will check for errors

Thank you

Hi Nikita, my code is working and running perfectly.

Thank you soooo much for the quick response and help. My form is looking good.

1 Like