Automatic field color change for different value range?

[danno_erickson]

Hi, I am a new user to Acrobat Pro and I am trying to figure out if it is possible to have the field color change when calculated value is within a specific range.  I have a calculated field box and I want it to turn yellow when it reaches a specific numerical range, and red when it gets to another.  A font color change would work too..

[George_Johnson]

Sure it's possible. Are you currently using a custom calculation script or one of the built-in calculation options?

[danno_erickson]

‌Just the built in sum of selected fields.

[George_Johnson]

You can use a custom Validation script for the field, something like the following:

// Custom Validate script for text field

(function () {

    // Set background color to white if blank

    if (!event.value) {

        event.target.fillColor = color.white;

        return;

    }

    // Convert value to a number

    var v = +event.value;

    if (v < 5) {

        event.target.fillColor = color.red;

        return;

  }

  if (v < 10) {

        event.target.fillColor = color.yellow;

        return;

  }

  // Value is greater than 10

    event.target.fillColor = color.green;

})();

[danno_erickson]

Thank you!

[danno_erickson]

So, here is what I have...It accepts it, but nothing happens.

(function(){

var v = +event.value;

if (v<16){

event.target.fillColor=color.green;

}

if (16<v>27){

event.target.fillColor=color.yellow;

}

//Value is greater than 26

event.target.fillColor=color.red;

})();

[George_Johnson · Accepted solution]

The correct code could be:

(function() {

    var v = +event.value;

    if (v < 16) {

        event.target.fillColor = color.green;

        return;

    }

    if (v < 27) {

        event.target.fillColor = color.yellow;

        return;

    }

    // Value is greater than 27

    event.target.fillColor = color.red;

})();

This line of code in particular isn't valid:

if (16<v>27){

Something like this would be:

if (v >= 16 && v < 27) {

which translated to English is: If the value of the variable v is greater than or equal to 16 and less than 27...

So another functionally equivalent script could be:

var v = +event.value;

if (v < 16) {

    event.target.fillColor = color.green;

} else if (v >= 16 && v < 27) {

    event.target.fillColor = color.yellow;

} else {  // Value is greater than or equal to 27

    event.target.fillColor = color.red;

}

I'm not sure if it's exactly what you want, but you should be able to revise it to suit.

[try67]

The first code you posted is not equivalent in functionality to your later code. In the former you're missing both the else-command and the more full conditions that are in later code. I would suggest to use the latter.

[George_Johnson]

The background color of the field is set the same for the same field value, which is what I mean by functionally equivalent. Note the return statements.

[danno_erickson]

Thank you George, woks perfect!

[try67]

My apologies. Didn't notice the return commands...

[danno_erickson]

Any idea why the yellow range doesn't work in Adobe Reader?  Works perfect in PDF Expert and Acrobat, and when it gets to the red values it works.  I am doing a Risk Assessment tool for my pilots and I have Reader as their PDF app.

[try67]

Could be because color.yellow is a CMYK color, while the others are RGB-based. Maybe the Reader app for iOS only supports RGB-colors...

Try replacing color.yellow with this: ["RGB", 1, 1, 0]

[danno_erickson]

That worked perfect!  Thank you both very much!

[danno_erickson]

One last question...is there a way to put a "reset" button on the form that zeros out all the fields, so that my pilot can just hit that to reset the fields and eliminate errors from them forgetting to zero them out themselves?  Thanks again!

[try67]

You can add a reset button that clears all of the values, sure, but you'll need to add additional code that changes the fill color of the fields. It would look something like this:

this.resetForm();

this.getField("Text1").fillColor = color.transparent;

this.getField("Text2").fillColor = color.transparent;

this.getField("Text3").fillColor = color.transparent;

etc.

[danno_erickson]

Thanks again for your help....sorry I'm such a rookie at this stuff, but it is fun to learn about it.

So, do I go into each field to add the code that changes the fill color, or is there a way to put a code in for the whole project?  Where would I go to put the code that you gave me?