Skip to main content
tim-b
Participating Frequently
July 23, 2025
Question

Form - Conditional format a field's fill colour based on a drop-down list selection

  • July 23, 2025
  • 2 replies
  • 372 views

Hi Acrobat users,

 

I have modified an existing form to meet a client's request. To add visual impact, I want to conditionally format the fill colour of the Action drop-down list and the adjoining text field. I desire to use custom RGB codes for readability purposes. A sample report is attached.

 

I am facing the following problems:

  1. The colour of the drop-down field does not change when a selection is made.
  2. The selection of an item from the drop-down list is not triggering the conditional formatting for the Comments text field.
  3. I am not sure of the correct format when specifying custom RGB colours. 2 different formats in the code to indicate the different formats that have been attempted.

 

Below is my JavaScript code for the drop-down list.

if (event.value==" ") event.target.fillColor = color.transparent;

else if (event.value=="Non-compliant") event.target.fillColor = [“RGB”, 0, 0.41, 0.38];

else if (event.value=="Recommendation") event.target.fillColor = [“RGB”, 0, 0.7, 0.28];

 

Below is my JavaScript code for the text field.

var selectedValue = “event.target.value”; // Get the selected value from the dropdown

var targetField = this.getField("Item Action.1"); // Replace with your field name

// Change the background color based on the dropdown value

if (selectedValue === " ") {

targetField.fillColor = color.transparent;

} else if (selectedValue === "Non-compliant") {

targetField.fillColor = [“RGB”, 0, 105/255, 97/255];

} else if (selectedValue === "Recommendation") {

targetField.fillColor = [“RGB”, 0, 179/255, 71/255];

} else {

targetField.fillColor = color.white; // Default color

}

 

If I can receive some assistance with these challenges, this would be greatly appreciated.

 

Many thanks,

Tim

2 replies

try67
Community Expert
Community Expert
July 23, 2025

- You must only use straight quotes in your code, not curly ones.

- Remove the quotes from this line:

var selectedValue = “event.target.value”;

tim-b
tim-bAuthor
Participating Frequently
July 24, 2025

Hi @try67 ,

 

I have removed the quotes as recommended.

 

Can you please help me understand what I need to do to action this point:

quote

- You must only use straight quotes in your code, not curly ones.

 

Just clarify what my desired outcomes are:

  • Drop-down field "Item Action.1" - change colour based on the selection of this drop-down list. Custom RGB colours have been chosen for readability reasons.
  • Text field "Comments_1" - change colour based on the selection of the "Item Action.1" drop-down list. Custom RGB colours have been chosen for readability reasons.

 

With the JavaScript applied to these 2 fields, neither of these outcomes has been achieved. Is it possible to provide the correct JavaScript code to achieve these outcomes, please? Feel free to reply with the code or add them directly to the attached sample report.

 

Many thanks in advance @try67 

 

Tim

try67
Community Expert
Community Expert
July 24, 2025

Straight quotes: " '

Curly quotes: “ ”

Do NOT edit the code in something like Word, as it will sometimes automatically use the latter instead of the former. Use a plain-text editor, only.

If you fix that issue your code will work.

Bernd Alheit
Community Expert
Community Expert
July 23, 2025

Check the Javascript console (cmd-j) for errors.