Javascript on a pdf form to change the colour of a field depending on the value in another field

[hollyj32411969]

I have used the following code to change the colour of a text field in a PDF form depending on the value entered into that field.

var v = +event.value; {
if (v>=1 && v<=5)   
event.target.fillColor = ["RGB",0.537,0.776,0];  
}  

Can anyone suggest how I can modify this code to change the colour of another field?

I want to change the colour of field "Text453" depending on the number entered into field "RISK"

(I have posted this question on another forum.)

[try67]

Change:

event.target.fillColor = ["RGB",0.537,0.776,0];

To:

this.getField("Text453").fillColor = ["RGB",0.537,0.776,0];

[hollyj32411969]

Okay great, I am so close.

I want more than one field to change and am trying to use this code.

As it isn't working I know I must be doing it wrong.

Any suggestions?

var v = +event.value;{
if (v == 1) 
this.getField("Text793" && "Text794" && "Text795").fillColor = ["RGB",0.537,0.776,0];
else this.getField("Text793" && "Text794" && "Text795").fillColor = color.white;} 

[Test Screen Name]

I don't know what you are trying to achieve with a list of field names of getField but that's not how it's done. If you need to do three field you need three separate statements. If they are part of an if statement wrap them in braces ie {...}

[hollyj32411969]

Thanks for the tips. I managed to work it out and went with the code below.

var v = +event.value;
{if (v == 1)   
this.getField("Text803").fillColor = ["RGB",0.537,0.776,0]; 
else this.getField("Text803").fillColor = color.white;} 
var v = +event.value;
{if (v == 1) 
this.getField("Text804").fillColor = ["RGB",0.537,0.776,0];
else this.getField("Text804").fillColor = color.white;}  
var v = +event.value;
{if (v == 2) 
this.getField("Text805").fillColor = ["RGB",0.537,0.776,0];
else this.getField("Text805").fillColor = color.white;}  
var v = +event.value;
{if (v == 2) 
this.getField("Text806").fillColor = ["RGB",0.537,0.776,0];
else this.getField("Text806").fillColor = color.white;}
var v = +event.value;
{if (v == 3) 
this.getField("Text807").fillColor = ["RGB",0.537,0.776,0];
else this.getField("Text807").fillColor = color.white;}  

[try67 · Accepted solution]

The correct syntax is to put the curly brackets after the if-condition. It works in your case because you only have one line of code associated with it, but it's not good practice. This is how it should look like:

var v = +event.value; 
if (v == 1) {
    this.getField("Text803").fillColor = ["RGB",0.537,0.776,0];
} else {
    this.getField("Text803").fillColor = color.white;
}

[gkaiseril]

Do you see any duplication of statements?

the use of the "{" and "}" indicate a block or series of statements to be executed instead of just one statement.

Moving all the duplicated lines of code so it is only executed one time could give you a script like:

// default all field fill color to white;

this.getField("Text803").fillColor = color.white;
this.getField("Text804").fillColor = color.white;
this.getField("Text805").fillColor = color.white;
this.getField("Text806").fillColor = color.white;
this.getField("Text807").fillColor = color.white;

// change certain fields on this field's value;

var v = +event.value; 
if (v == 1) {
      this.getField("Text803").fillColor = ["RGB",  0.537, 0.776, 0];  
      this.getField("Text804").fillColor = ["RGB", 0.537,  0.776, 0]; 
}
if (v == 2) {
      this.getField("Text805").fillColor = ["RGB", 0.537, 0.776, 0];
      this.getField("Text806").fillColor = ["RGB", 0.537, 0.776, 0]; 
}
if (v == 3)  {
this.getField("Text807").fillColor = ["RGB", 0.537, 0.776, 0];

}

I would use the above script in the "On Blur" action so it only executes when the input field is changed and the user tabs out of the field.

To see the full effect you should turn off field highlighting in Acrobat's/Reader's preferences.

[ihteshamu35126935]

i need light pink and light green can you help

var f = event.target;  
var fv = event.value;

if (fv == "Good") {
  f.fillColor = color.green;
}
else if (fv == "Fair") {
  f.fillColor = color.yellow;
}
else if (fv == "Poor") {
  f.fillColor = color.red;
}
else {
  f.fillColor = color.white;
}

[try67]

Do you know the RGB values for these colors?

[ihteshamu35126935]

it does not work i tried

[try67]

You did not answer my question, nor specified what you tried and what the results were. I can't help you if you don't provide basic information.

[ihteshamu35126935]

sir i need color drop down list in PDF in color back ground

YES  as light green color.

NO   as light pink

Manager no as RED color.

var f = event.target;  
var fv = event.value;

if (fv == "YES") {
  f.fillColor = color.green;
}
else if (fv == "NO") {
  f.fillColor = color.yellow;
}
else if (fv == "Manager NO") {
  f.fillColor = color.red;
}
else {
  f.fillColor = color.white;
}

[try67]

In addition to what TSN said, where did you place the code? Does it work with the colors you have in it at the moment?

[ihteshamu35126935]

its not working perfectly.

[Bernd Alheit]

What is not working?

[Test Screen Name]

You did not answer the question. Do you know the RGB values for these colours? Please answer. Do not ignore any part of the reply.

[ihteshamu35126935]

YES sir i know RGB colors

[Test Screen Name]

Ok, please post your attempted code with the RGB colours. We cannot guess what problem you are having. And please answer ALL THE QUESTIONS. Where did you place the code?

[ihteshamu35126935]

i place below codes in combobox>>> properties>>>>vaildate

& its no working sir

all i want is combobox background colors for different selections i.e YES in green background & NO in RED background.

var f_color = color.white;

if (event.value === "NO") f_color = color.red;

if (event.value === "Manager NO") f_color = color.red;

if (event.value === "YES") f_color =color.green;

event.target.fillColor = f_color; 

[ihteshamu35126935]

var f_color = color.white;

if (event.value === "NO") f_color = color.red;

if (event.value === "Manager NO") f_color = color.red;

if (event.value === "YES") f_color =color.green;

event.target.fillColor = f_color; 

[Test Screen Name]

You said you wanted to use a light green and a light pink.

We asked if you had the RGB colours to use, and you said yes.

I asked to see the code using the colours, which had problems.

I am still trying to answer your first question.

[ihteshamu35126935]

sir  our requirements  changes no RBG needed. i want  you help me.

How can i change my combobox/dropdown list background color change.

i have  YES    &   No in my dropdown list

i want YES in green back ground

& no in RED backround.

i want to know how.

Consider me as bigneer.

[try67]

That's not possible. You can't assign different colors to various options

in the field.

On Mon, May 27, 2019, 23:02 ihteshamu35126935 <forums_noreply@adobe.com>

[ihteshamu35126935]

i have done it but it is not working on smartphone works great on pc color changed by different selection

[gkaiseril]

Mobile devices do not have the full implementation of JavaScript and most of the implementation depends upon the platform and the app being used.

Adobe JavaScript API and Forms Mobile Devices

To know for sure if your form will work one needs to test on each mobile device and app.