Skip to main content
Henry.Ong
Inspiring
November 18, 2020
Answered

How to change the field background color and text depending on condition

  • November 18, 2020
  • 1 reply
  • 2268 views

Good day!

 

I have a computed field in fillable PDF (Total_Percentage is the field name).

 

I waht the background color of the field and text to change depending on the following conditins:

 

If Total_Percentage is < 100, I want the background to be yellow and text to be black

If Total_Percentage is = 100, I want the background to be green and text to be white

If Total_Percentage is > 100, I want the background to be red and text to be white.

 

I search in YouTube for solution and saw one but cannot make it work.

 

Thank you!

This topic has been closed for replies.
Correct answer Nesa Nurani

Try this code  as validation script:

if(event.value <= 99){
event.target.fillColor = color.yellow;
event.target.textColor = color.black;}
else if (event.value == 100){
event.target.fillColor = color.green;
event.target.textColor = color.white;}
else if(event.value >= 101){
event.target.fillColor = color.red;
event.target.textColor = color.white;}

1 reply

ls_rbls
Community Expert
Community Expert
November 18, 2020

You can use a custom calculation script in the Total_Percentage field:

 

var f = event.target;

// If Total_Percentage is < 100, I want the background to be yellow and text to be black

if (f.value <= 99) {
f.fillColor = color.yellow;
f.textColor = color.black;
} else {

// If Total_Percentage is = 100, I want the background to be green and text to be white
if (f.value === 100) {
f.fillColor = color.green;
f.textColor = color.white;
} else {

// If Total_Percentage is > 100, I want the background to be red and text to be white.

if (f.value >= 101) {
f.fillColor = color.red;
f.textColor = color.white;
}
}
}

 

Nesa Nurani
Community Expert
Community Expert
November 18, 2020

Just to add up, if you have field formated as percentage change numbers in code:

99 to 0.99

100 to 1

101 to 1.01