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

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!!!! smile

1 answer

1 accepted

This widget could not be displayed.

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

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...

@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.

Suggest an answer

Log in or Sign up to answer
Community showcase
Posted Tuesday in Jira

What modern development practices are at the heart of how your team delivers software?

Hey Community mates! Claire here from the Software Product Marketing team. We all know software development changes rapidly, and it's often tough to keep up. But from our research, we've found the h...

203 views 1 3
Join discussion

Atlassian User Groups

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

Find a group

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

Find my local user group

Unfortunately there are no AUG chapters near you at the moment.

Start an AUG

You're one step closer to meeting fellow Atlassian users at your local meet up. Learn more about AUGs

Groups near you