How to hide options from select list using JAVASCRIPT?

[Yogesh]

Here is a select list with A1, A2 and B1, B2 options. I want hide the A1 and A2 if the issue type is set to Bug during issue creation process.

In shrt, I have a drop down list and would like to remove an option from it, given the text/value of that particular option. Is it possible using javascript? Just like 'append' which adds an option to the drop down list, is there a function to remove an option?

I tried searching for it but all I got were examples where the entire set of options in the drop down list are removed, which is not what I seek.

[Nikhil Naoghare · Accepted solution]

Yogesh, Following is the JS code for the later one.

<script type="text/javascript">
targetCategory = document.getElementById('customfield_10003'); // Main Option
targetSubCategory = document.getElementById('customfield_10003:1'); //Sub Category option.
subCategoryOptionsCount = document.getElementById('customfield_10003:1').length;
tempVar = 0;
while(tempVar < subCategoryOptionsCount)
	{
		if(targetSubCategory.options[tempVar].text=="Option's Name" )
		{
			targetSubCategory.remove(tempVar);
			subCategoryOptionsCount--;
		}	
		tempVar++;
	}
</script>

[Yogesh]

Thanks Nikhil!!! It worked well!!!

[Nikhil Naoghare]

Hi Yogesh,

This will only help when the custom field is of Select List type. But what if the custom field is of Cascaded Style. Then there is a differnet way to hide the options in the cascaded list also.

[Yogesh]

Yes. I am aware of the option. Once I get some time, I will put the code. Why dont you put your option here itself?

[Yogesh]

I guess the below code works for me. Even we can create Array for the base value and the field value which should be changed on the basis of base value.

<script language="JavaScript" type="text/javascript">
window.onload = function() {
var gwrCategory = document.getElementById('customfield_10100'); // MODIFY: Custom field ID
var undesiredValue = "Text option to be hidden"
var issueType = document.getElementById("issue-create-issue-type"); // MODIFY:
var issueA = issueType.innerHTML;
if(issueA == "Bug" ) {
for(var i=0; i<gwrCategory.options.length; i++){
if ( gwrCategory.options[i].text == undesiredValue ){
gwrCategory.remove(i);
break;
}
}
}
};
</script>