This post is a continuation of the first post found at the following link.

Information found at that link is still valid but there is a new twist in the plot and so I decided to start a new thread to cover that scenario.

Highlights From First Episode

Managers have a team and they have an option to give team members the boot both individually, and when multiple folks are selected, en masse. We removed those options with CSS. HR is happy.

Second Episode Teaser

As the manager - you find out that your boss, can still give your team members the boot even though you cannot. You inform HR and the tension in the room becomes palpable.

Discussion

Information at the link above works fine when your organizational structure is only one manager deep. This is due to the fact that Direct Managers have a few more options with their teams than the Functional Manager one level up does. This results in the “Remove From Team” option appearing at different positions in the pop-up menu.

Below you can see the view from the Functional Manager perspective. Deanna Tester is a part of the Functional Manager’s team and Paul Tester is a part of Deanna Tester’s team. You’ll see that in the lower left, the Functional Manager has the ability to drill down into Deanna Tester’s team.

As the Functional Manager looking at my direct team - notice I have five options, but when I drill down another level, I lose the ability to enroll those folks. As a result, we see “Remove from Team” at the fourth position in the list for direct team members but at the second position in the list for the additional subdivision.

The Problem

In the first episode, we removed the option to “Remove from Team” from the list with some CSS code.

.team-member-card__actions div.ui-button-dropdown-menu.ui-shadow-md ui-button-dropdown-option:nth-child(4){
    display: none;
}

Notice part of the code reads  nth-child(4) . That is where we address that fourth item in the list.

However - there is no fourth item in the menu for the team member two levels down.

The CSS is essentially the same for these two menus and so I can effectively remove the “Remove from Team” option from that list as well by simply re-using the same code and changing the 4 to a 2 like so…  nth-child(2) .

Unfortunately, this will affect the list of the direct team as well and remove the ability for the direct manager to enroll their team members to courses. If that is not a problem for you - we’re done here.

But if that is a problem - how do we get that ability back and still hide the option to remove team members for the Functional Manager?

Troubleshooting

Digging into this at first, I ultimately wanted a way to address the two menus separately and call it good but that was not in the cards - at least not that I was able to determine.

So I had to try something a little less than ideal.

I noticed that the menu items each had an ID - which means I should be able to address only that element by using it.

So after hiding nth-child(2) - I went back in to CSS for the Direct Manager and chose to show that specific element 

#ui-button-dropdown-8-1 {

display: block;

}

which should then reveal the “Enroll to Courses” option for the Direct Manager while keeping the “Remove from Team” option still hidden on the team member even though they are both in the second position.

It didn’t work.

Go back and inspect.

What!!?

The ID of the same element had changed…

Further examination revealed that all of those menu options had IDs that incremented every time I drilled down to the team and back to the direct manager.

How was I supposed to nail that down?#!@%?

I didn’t

I ended up refreshing the screen and looked again at my Direct Manager level card.

The count seemed to start over and this represented my baseline for this card.

Resolution

So I finally ended up with something that works but is truly not very elegant and it will require some additional research for each of you who needs to implement this and the amount of work will depend on the size of your organization and the number of direct managers you have under another functional manager.

So two main things here and why this is not ideal. It will become tedious at best.

1. You will need to dig into the code with the browser console to find the direct manager’s card ID for the Enroll to Course option. It will need to be done for EVERY direct manager you have. Simply copy the code for restoring that below and paste it - then change the ID
2. Because the ID changes - make sure you have the baseline for each direct manager and then be sure to train your direct managers to remember to refresh the browser if that option does not appear in their list.

So here it is.

/** Hide the Remove from Team option from cards **/

/** This option hides the Remove from Team option from Functional Manager view **/
/** This also hides the Enroll to Courses option from the Direct Manager view **/
.team-member-card__actions div.ui-button-dropdown-menu.ui-shadow-md ui-button-dropdown-option:nth-child(2){
    display: none;
}

/** This option hides the Remove from Team option from Direct Manager view **/
.team-member-card__actions div.ui-button-dropdown-menu.ui-shadow-md ui-button-dropdown-option:nth-child(4){
    display: none;
}

/** This hides the Remove from Team option from pop up menu **/
/** Pop-up menu is only available when multiple team members are selected. **/
a.action-can_remove_relation {
    display: none !important;
}

/** This restores the Enroll to Courses option for the Direct Manager **/
/** You will need to inspect the Code to find each Direct Manager card number **/
/** This must come after the code to hide found above **/
#ui-button-dropdown-2-1 {
    display: block;
}

Final Plea

Here is the idea for all to vote on.

My solution, while functional, is not ideal. It will require maintenance.

@Marco.T - Perhaps this will serve as some more useful feedback and support for the idea linked above.

At any rate - please let me know if there are any questions about the option.