Changing the background and text of a read only field when certain text is populated

[defaultu4w8lgkwftxn]

I have a read only text field called Rating that is populated when using fields are selected from a risk matrix. For example when A is selected from Likelihood dorpdown box and 1 from Consequence dorpdown box the words "Very Low" are automatically populated in the Rating field and so on and so forth for the following full risk matrix:

I am wondering if there is a away for the Rating field to automatically change its colour (as per the above) when the specific words appear in the field. Dark Green (HEX: #00B056) for Very Low, Light Green (HEX: #02D050) for Low etc?

I have found the following, but as I am not a Javascrip expert I am struggling to convert this to what I need:

// get the current value of the field and compare it to the default value.
if (event.value == event.target.defaultValue) {
// set the background and text color to the default values
event.target.textColor = [ "G", 0.5 ];
event.target.fillColor = [ "G", 0.9 ];
}
else {
event.target.textColor = color.black;
event.target.fillColor = color.white;
}

Any assistance would be greatly appreciated. I have attached my form to make it easier to understand what I have so far done.

[kglad]

is this an animate question?

[defaultu4w8lgkwftxn]

No 

[kglad]

what app

[defaultu4w8lgkwftxn]

Sorry it is an adobe pdf form

[kglad]

in the future, to find the best place to post your message, use the list here, https://community.adobe.com/

p.s. i don't think the adobe website, and forums in particular, are easy to navigate, so don't spend a lot of time searching that forum list. do your best and we'll move the post if it helps you get responses.

<moved from using the community>

[defaultu4w8lgkwftxn]

Thank you

[kglad]

sure

[Nesa Nurani · Accepted solution]

You can add colors to your validate script like this (check blue text):

var str = this.getField("Likely1").valueAsString+this.getField("Consequence1").valueAsString;
switch(str){
case "A1": case "B1": case "A2":
event.value = "Very Low";
event.target.fillColor = ["RGB", 0/255, 176/255, 86/255]; //(HEX: #00B056)
event.target.textColor = color.white;
break;
case "A3": case "B2": case "C1": case "C2":
event.value = "Low";
event.target.fillColor = ["RGB", 2/255, 208/255, 80/255]; //(HEX: #02D050)
event.target.textColor = color.black;
break;
case "A4": case "A5": case "B3": case "B4": case "C3": case "D1": case "D2": case "E1":
event.value = "Medium";
break;
case "B5": case "C4": case "D3": case "D4": case "E2": case "E3":
event.value = "High";
break;
case "C5": case "D5": case "E4": case "E4": case "E5":
event.value = "Extreme";
break;
default:
event.value = "";}

[defaultu4w8lgkwftxn]

Hi Nesa

That is awesome thank you.

Works a treat.

[defaultu4w8lgkwftxn]

Sorry another question.

In my form another page can be added but on the added page the array does not work as the names for the fields change every time a page is added.

How do I get the array to change so that the field name changes in the Javascript.

Eg: var str = this.getField("Likely1").valueAsString+this.getField("Consequence1").valueAsString;

When a new page is added the javascript needs to automatically update to:

var str = this.getField("P10.Risks.Likely1").valueAsString+this.getField("P10.Risks.Consequence1").valueAsString;

And then if yet another page is added the script will be:

var str = this.getField("P11.Risks.Likely1").valueAsString+this.getField("P11.Risks.Consequence1").valueAsString;