It's not the same without you

Join the community to find out what other Atlassian users are discussing, debating and creating.

Atlassian Community Hero Image Collage

Javascript in JIRA : enable/disable a listbox related to the contents of another listbox

Christophe Leite Sep 16, 2013

Hi all,

On an issue screen, I've got two listbox fields list1 and list2. I wonder if it was possible to choose a value in list1. And list2 will be enabled or disabled, according to the value selected in list1.

In my above example, list1 contains both "Yes" and "No"

If I choose "Yes" list2 will be enabled, otherwise, it will be disabled. Is this possible to do that on a JIRA issue screen ?

Thanks a lot,

Any help greatly appreciated.

6 answers

1 accepted

1 vote
Answer accepted
Rambanam Prasad Sep 16, 2013

try with this script by changing custom field ids as per your instance

<script type="text/javascript">  
jQuery(document).ready(function($) {    
JIRA.bind(JIRA.Events.NEW_CONTENT_ADDED, function (e, context) {    
    callHideShowFunction();
});
callHideShowFunction();
function  callHideShowFunction(){
        showHideSelectList();
        $("#customfield_11704").closest('div.field-group').hide();  
        $('#customfield_11911').change(function() { 
            showHideSelectList();
        });
}
    function showHideSelectList(){          
        var emergencyImpl=$.trim($("#customfield_11911 :selected").text())
     
        if( emergencyImpl == "Yes" ){ 
            $("#customfield_11704").closest('div.field-group').show();
        }else {
            $('#customfield_11704').val('');
            $("#customfield_11704").closest('div.field-group').hide();
        }
    }
});
</script>

i think you can convert list1 to radio button because it have only two values, if you want use radio button then you can have solutiion here

https://answers.atlassian.com/questions/158035/need-to-hide-show-a-textfield-based-on-the-value-of-the-check-box-using-javascript

0 votes
Christophe Leite Sep 16, 2013

Rambanam, first of all, thank you very much for your quick answer.

Then, I've tried to use your code. But I met a problem when I try to modify my issue : first field list1 is filled with the value I've selected ("Yes"), the other one, list2, too. But when I try to modify list2, it erases its value and list2 becomes invisible ...what can I do to solve this problem ? in the issue modification screen, I'v tried to modify list1 thinking that list2 appears with correct value, but list2 is still not visible...

Rambanam Prasad Sep 16, 2013

can you share your custom field id's/script so i can debug it!!

0 votes
Christophe Leite Sep 16, 2013

Thanks, you're great ! :-) I did not know a lot about javascript language unfortunately :-(

Here is my code. I follow your advice (I prefer to continue with listbox instead of radio button), but it still does not work on modification screen...

<script type="text/javascript">
jQuery(document).ready(function($) {
JIRA.bind(JIRA.Events.NEW_CONTENT_ADDED, function (e, context) {
callHideShowFunction();
});
callHideShowFunction();
function callHideShowFunction(){
showHideSelectList();
$("#customfield_10902").closest('div.field-group').hide();
$('#customfield_10903').change(function() {
showHideSelectList();
});
}
function showHideSelectList(){
var emergencyImpl=$.trim($("#customfield_10903 :selected").text())
if( emergencyImpl == "Yes" ){
$("#customfield_10902").closest('div.field-group').show();
}else {
$('#customfield_10902').val('');
$("#customfield_10902").closest('div.field-group').hide();
}
}
});
</script>

Rambanam Prasad Sep 16, 2013

which one is list1 and list2 field ?

is list1 is customfield_10902 and list 2 is customfield_10903, is it correct or i am wrong?


Christophe Leite Sep 16, 2013

list1 is 10903

list2 is 10902

0 votes
Rambanam Prasad Sep 16, 2013

your code seems correct except minor change, try with this

&lt;script type="text/javascript"&gt; 
jQuery(document).ready(function($) { 
JIRA.bind(JIRA.Events.NEW_CONTENT_ADDED, function (e, context) { 
callHideShowFunction();
});
callHideShowFunction();
function callHideShowFunction(){
		showHideSelectList();	
	$('#customfield_10903').change(function() { 
		showHideSelectList();
	});
}
function showHideSelectList(){ 
	var emergencyImpl=$.trim($("#customfield_10903 :selected").text());
	alert("emergencyImpl: "+emergencyImpl);
	$("#customfield_10902").closest('div.field-group').hide(); 
	if( emergencyImpl == "Yes" ){ 
		alert("emergencyImpl value is Yes");
		$("#customfield_10902").closest('div.field-group').show();
	}else {
		alert("emergencyImpl value is No");
		$('#customfield_10902').val('');
		$("#customfield_10902").closest('div.field-group').hide();
	}
}
});
&lt;/script&gt;

add the above script in list2 field description

Christophe Leite Sep 16, 2013

it does not work... result is similar. On the issue modification screen I cannot modify the value of list2 :-(

Rambanam Prasad Sep 16, 2013

i have updated my answer with alerts so try with that and let me know what alerts are popup!!

Rambanam Prasad Sep 16, 2013

is it worked? what was the problem?

0 votes
Christophe Leite Sep 16, 2013

So, I create an issue. I have an alert emergencyImpl:None. I click on OK and then have an other alert emergencyImpl value is No. I click OK. Another time emergencyImpl:None. And then emergencyImpl value is No.

I choose Yes in my list1, I have an alert : emergencyImpl : Yes ... and then an other : emergencyImpl value is Yes, and then emergencyImpl : Yes, and then emergencyImpl value is Yes

I choose No in my list2, I have an alert : emergencyImpl : No ... and then emergencyImpl value is No .... and then emergencyImpl : No and then emergencyImpl value is No

Rambanam Prasad Sep 16, 2013

this is weired!! i am not sure why it is triggering onchange event for list 2 field :(

0 votes
Christophe Leite Sep 16, 2013

Well, it does not matter ! Do not annoy you with that, it is already very nice that you help me! : -)

Thanks a lot... I will find another way ;-)

Suggest an answer

Log in or Sign up to answer
This widget could not be displayed.
This widget could not be displayed.
Community showcase
Published in Next-gen

Introducing subtasks for breaking down work in next-gen projects

Teams break work down in order to help simplify complex tasks. This is often done iteratively, with tasks being broken down into smaller tasks and so on until the work is accurately captured in well-...

9,982 views 46 44
Read article

Community Events

Connect with like-minded Atlassian users at free events near you!

Find an event

Connect with like-minded Atlassian users at free events near you!

Unfortunately there are no Community Events near you at the moment.

Host an event

You're one step closer to meeting fellow Atlassian users at your local event. Learn more about Community Events

Events near you