How to use JavaScript to change text color in Single Select Dropdown

[Paddy Byrne]

Hi, 

I need to change the text colors of the items in a Single Select Drop-down cf. Using the 'Inspect' feature in chrome, I have found the correct property that needs to be changed, but I just cannot figure out the correct syntax to access the 'color' property and change it.

I have some basic java-script that is correctly capturing the chosen value, but cant seem to nail down the correct syntax to change the color..

<script type="text/javascript" >
try
{
var sel = document.getElementById('customfield_10808');
state = sel.options[sel.selectedIndex].text;
if (state == 'RED')
{  alert(sel.options[sel.selectedIndex].text); // works and alerts selected value
// AJS.$(sel.style.color = red); // does not work
// AJS.$('#sel').css('color', cl); // does not work
// AJS.$("#sel").find("option").css("color", "red"); // does not work
// AJS.$("sel").form.aui. text.color: red); // does not work
// document.querySelector('#customfield_10808 aui-option[color="red"]'); // does not work
// AJS.$(sel.css.aui-option[color="red"]'); // does not work
// <style>#customfield_10808-val{color:red}</style>; // does not work
// AJS.$("sel").aui-select2-container[color="red"];  // does not work
// AJS.$("sel").aui-select2-container {color: #333;}; // does not work
// What to do????
}}
catch(err){}
</script>

Info.PNG

Jira 7.1. Any advice appreciated, its driving me nuts!!!! 

styleable-options.png

Info.PNG

multi-select.png

[Deniz Oğuz - The Starware · Accepted solution]

Instead of using build-in single select and JS hacks, you can use our Custom Fields++ add-on. It provides following extra features on top of original single select field:

• coloring for each option (any css style)
• icons for each option
• extra help text that is shown when users hover on an option
• auto complete

They are direct replacement of build-in custom fields so migration is very easy. In addition to single select it has extra custom fields too. 

multi-select.pngstyleable-options.png

[Paddy Byrne]

Excellent, thanks for the tip!

Is there a version for JIRA 7.1? the marketplace only seems to list it for 7.2 and higher...

[Deniz Oğuz - The Starware]

@Paddy Byrne,

Yes the latest version supports 7.0.0 and up. But you need to click on more versions and download the version with -jira7.0.0 suffix.