Hide user role related details from Users and roles page of Project Settings
Platform Notice: Data Center Only - This article only applies to Atlassian products on the Data Center platform.
Note that this KB was created for the Data Center version of the product. Data Center KBs for non-Data-Center-specific features may also work for Server versions of the product, however they have not been tested. Support for Server* products ended on February 15th 2024. If you are running a Server product, you can visit the Atlassian Server end of support announcement to review your migration options.
*Except Fisheye and Crucible
Summary
This knowledge base article describes a scenario where user should not be able to view "Add users and Role button" and existing "Roles" for users in Users and roles page of Project Settings.
Environment
Jira 8.x and later
Solution
One example of achieving this using javascript is mentioned below.
We can add custom CSS or Javascript via Configuring an announcement banner
The code below will only execute on page load and if the page URL has/plugins/servlet/project-config/ .
There are two section(html div) in page, first div is having the "Add users and Role button" and second div is having the table structure with project user and role.
First div loads quicker then second div thus if user does not set timeout, html elements in second div will not be ready till then.
Thus it might not be possible to hide elements in second div as the div is not yet ready or available.
With help of method setTimeout(), user can delay execution of a javascript method to hide elements in second div.
This setTimeout() is async and doesn't block other javascript code execution. Timeout value(400 in example) can vary as per data to load.
Screenshot before and after applying this script are provided at bottom of this article. We can find that "Add users and Role button" and "Roles" are hidden in second Screenshot.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<script>
function displayDropList() {
const dropdownListArray = document.getElementsByClassName("Droplist-sc-1z05y4v-0 jqXYNP");
for (const dropdownList of dropdownListArray ){
dropdownList.style.display = 'none';
}
}
$(window).on('load', function() {
if (document.URL.indexOf("/plugins/servlet/project-config/") >= 0) {
jQuery(document).ready(function(){
// hide Add users and Role button
document.getElementsByClassName("css-1yx6h60")[0].style.display = 'none';
// after waiting for page to load for 400ms, hide user's role set in dropdownList.
const myTimeout = setTimeout(displayDropList, 400);
});
}
});
</script> Only use JavaScript if you intend to hide elements on some pages but not others.
Any error in the JavaScript code because of the absence of an element from a given page will break the entire execution.
Saving the announcement banner may result in a browser error that can be ignored.
Was this helpful?