Javascript - Change fill colour depending on the value in the field

[hollyj32411969]

I have been using the forums to help me answer the question above and I have managed to create the code below.

var f = this.getField("Text552").value;  {
if (f>=1 && f<=5)
 event.target.fillColor = ["RGB",153,204,0];  
else if (f>=6 && f<=8)  
 event.target.fillColor =["RGB",255,204,153];  
else if (f>=9 && f<=15)  
 event.target.fillColor = ["RGB",255,139,61];
 else if (f>=16 && f<=25)  
 event.target.fillColor = ["RGB",214,0,0];
else event.target.fillColor = color.white;
}

Using this code the fill colour changes for values 1-5 and 16-25 but not for the rest. Can anyone suggest what I might be doing wrong?

[try67 · Accepted solution]

It shouldn't work for any of them, except for the last one. The reason is you're using the wrong numeric values.

The color object uses values from 0 to 1, not 0 to 255. Divide all your values by 255 and it should work correctly.

[try67 · Accepted solution]

It shouldn't work for any of them, except for the last one. The reason is you're using the wrong numeric values.

The color object uses values from 0 to 1, not 0 to 255. Divide all your values by 255 and it should work correctly.

[hollyj32411969]

Thank you. With your help and some more research, I now have the below code and it works perfectly.

var f = this.getField("Text552").value;  {
if (f>=1 && f<=5)
    event.target.fillColor =["RGB",0.537,0.776,0];  
else if (f>=6 && f<=8)  
    event.target.fillColor =["RGB",1,0.804,0.623];  
else if (f>=9 && f<=15)  
    event.target.fillColor = ["RGB",1,0.709,0];
 else if (f>=16 && f<=25)  
    event.target.fillColor = ["RGB",1,0,0];
else event.target.fillColor = color.white;
}

[kandices70514105]

I think I amhaving trouble because I don't understand the terms.  I need the background color on my text form field to change when text is entered in to the box.  for example when i enter my initials i want it to change color to separate the complete items from the incomplete items on my list. The discussion above is so far over my head I'm lost.  I have figured some of these things out before but can't mange to get this one to work.  This is what I have...

if(this.3rd Qtr.0 != null)
{
this.border.fill.color.value >" "; // colour light blue
}
else
{
this.border.fill.color.value = null; // colour white
}

[John Eagle]

Hi

I am new to Acrobat Form creation and would like to change a text colour based on its value

Green if under 400 and red if above 400

i would be grateful if you could help the text box is labelled as FD1 on teh form

Thank you 

[Test Screen Name]

You should be able to take hollyj's reply as a model. Be sure you understand the importance of the numbers in the RGB values. Best to read the question and compare to see what was needed.

[John Eagle]

i put this in the JavaScript edior and saved the document byit is just showed green whatever figure I put in?

var f = this.getField("FD1").value; {

if (f>=400.00 && f<=2000.00)

event.target.textColor = color.red;

else if (f>=0.00 && f<=400.00)

event.target.textColor = color.green;

}

[Test Screen Name]

Looks ok, at first glance.

1. Do you get any messages in the JavaScript console when you change the value?

2. Where do you add this JavaScript (there are so many places you might choose)?

[John Eagle]

I have not seen any meassages

Its in the validate tab 

[John Eagle]

Should this be in a different script editor?

[Thom Parker]

You'll find a tutorial on the Console Window here:

https://www.pdfscripting.com/public/Free_Videos.cfm#JSIntro

[John Eagle]

Hi all sorted thank you, it wa snot in the correct field now works very well

i also need to create a text box that states PASS or FAIL if all three boxes FD1 FD2 and FD3 have not rurned Green (<400) but i dont now how to vreate the text based on the result of the three results.

could you help?

[liborb94033412]

Why this does not work? The field is still visible.

getField("fieldName").fillColor = color.white;

if (getField("fieldName").fillColor == color.white) // here is some problem
getField("fieldName").display = display.hidden;

[Bernd Alheit]

For comparing colors, use the color.equal() function.

[Test Screen Name]

While it's an oversimplification, it's best to say "Use == only for strings and numbers". color.white is neither of these, in fact we don't know exactly what it is and shouldn't try to find out. Hence, the provision of a special method to check equality is very useful to us.

[liborb94033412]

Thank you both for answer, now i have a solution.

getField("fieldName").fillColor = [ "G", 1 ];
if (color.equal([ "G", 1 ], this.getField("fieldName").fillColor))
getField("fieldName").display = display.hidden;

[lukass95601205]

Hello i need Help please.

Everytime i try this script it says:
TypeError: event.target is undefined
19:Console:Exec
undefined

I just want to change the Text-Colour to red if i type the Number "5" in a certain Textfield in Acrobat.
There are lots of Texfields and i need the Script for all of them (not only for one specific Field).

I dont know what to do, tried a lot of different scripts but none of them worked yet. Would be great if someone could solve my Problem. Thank you!!

[Bernd Alheit]

Use a script at validation of the textfield. You can't use event.target in the console.

[lukass95601205]

Hallo Benrd,
leider bin ich mit dem Thema Scripten usw nur sehr wenig vertraut bzw. kenne mich leider nicht gut aus. Hast du vielleicht eine Idee wie ich das machen kann?

Danke und LG

[Bernd Alheit]

E.g.:

if (event.value == 5) {
  this.getField("field name").textColor = color.red;
}

[lukass95601205]

super - danke!

[Sharon38055632khef]

if(event.value >= 5)
event.target.fillColor= color.red;
if(event.value >= -5)
event.target.fillColor= color.transparent;

What happens if you take the first part of my script? 

 if(event.value = 5)
event.target.fillColor= color.red;

[Sharon38055632khef]

I have a script where I am having two issues.  What I want the script to do is turn any number over 5 red and any number more than -5 red. I need the number to return to transparent if a number is changed back within the transparent parameters. 

My script is:

if(event.value >= 5)
event.target.fillColor= color.red;
if(event.value >= -5)
event.target.fillColor= color.transparent;

I have tried to figure out the - 5 and also to have the number return to transparent when parameters change but can't seem to get there. Any help?

[Sharon38055632khef · Accepted solution]

I found it, it was as simple as the box was checked red instead of none. It works fine now and thank you for all your help today. 

[S. S]

Hi @Sharon38055632khef,

Hope you are doing well. 

Thanks for sharing about what worked for you.

Marking this as a correct answer for future users to use as a reference.

Regards,
Souvik.