Change field colour depending on empty or completed field

New Here ,
Apr 13, 2022 Apr 13, 2022

Copy link to clipboard

Copied

Hi - I have an editable PDF form, that I basically want to turn all the fields red if the boxes are empty, once they have been completed they turn back to white - note they are just free text boxes not based on any specific values.

 

Its just as a prompt to the user to complete the field.

 

Can you advise please? I have got close using code I have found online but can't seem to get it to work correctly.

TOPICS
Create PDFs , Edit and convert PDFs , JavaScript , PDF forms

Views

192

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Adobe Community Professional , Apr 14, 2022 Apr 14, 2022

You have to change their values or clear the form for it to kick in.

Likes

Translate

Translate
Adobe Employee ,
Apr 13, 2022 Apr 13, 2022

Copy link to clipboard

Copied

Hi Jadef

 

Hope you are doing well and sorry to for the trouble.

 

Please open the PDF form in Acrobat Pro DC >  Go to Tools > Prepare Form > Double click on the Form field to open the form field properties and Select 'Required' to make the field required.

 

It will force the user to fill in the selected form field. If the user attempts to submit the form while a required field is blank, an error message appears and the empty required form field is highlighted.

https://helpx.adobe.com/acrobat/using/pdf-form-field-properties.html

 

Capture.PNG

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Regards

Amal

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Apr 13, 2022 Apr 13, 2022

Copy link to clipboard

Copied

This does not achieve what they asked for. A required field will always be painted in red, regardless of whether it has a value.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Apr 14, 2022 Apr 14, 2022

Copy link to clipboard

Copied

Hi Try67

 

Yes this is correct, I want all the fields red if the boxes are empty, once they have been completed they turn back to white. Do yoy know if this is possible?

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Apr 14, 2022 Apr 14, 2022

Copy link to clipboard

Copied

Place this script as a Validation script in each concerned field:

 

if (event.value == event.target.defaultValue) {event.target.strokeColor = color.red};
else {event.target.strokeColor = color.white};

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Apr 14, 2022 Apr 14, 2022

Copy link to clipboard

Copied

Thank you - I get a SyntaxError:syntax error 2:at line 3, can you advise please?

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Apr 14, 2022 Apr 14, 2022

Copy link to clipboard

Copied

Change it to:

 

if (event.value == event.target.defaultValue) {event.target.strokeColor = color.red}
else {event.target.strokeColor = color.white};

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Apr 14, 2022 Apr 14, 2022

Copy link to clipboard

Copied

Thank you for this, is there a way to do this for the fill color instead of just the stroke?


Also, I originally added some javascript to the page which on opening turnt the fields red. I have removed the code, but its still turning the fields red (all other of my other fillable pdf's!) - do you know how I can stop this?

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Apr 14, 2022 Apr 14, 2022

Copy link to clipboard

Copied

- Add another line where you set the fillColor property, too. Like this:

 

if (event.value == event.target.defaultValue) {
	event.target.strokeColor = color.red;
	event.target.fillColor = color.ltGray;
}
else {
	event.target.strokeColor = color.white;
	event.target.fillColor = color.white;
}

 

- You probably enabled the fields highlighting, which will override these colors. To disable it go to Edit - Preferences - Forms and tick off "Show border hover color for fields". You can also do it from the purple bar at the top of the document when you open it.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Apr 14, 2022 Apr 14, 2022

Copy link to clipboard

Copied

So I have toggled off the 'Show Border hover color for field' so it changed all fields to white.

 

However, I have added in the validation script to a couple of fields and no colour shows at all.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Apr 14, 2022 Apr 14, 2022

Copy link to clipboard

Copied

You have to change their values or clear the form for it to kick in.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Apr 14, 2022 Apr 14, 2022

Copy link to clipboard

Copied

Amazing - thank you for your help! 🙂

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Apr 14, 2022 Apr 14, 2022

Copy link to clipboard

Copied

Sorry - do you know how to make it apply to check boxes too?

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Apr 14, 2022 Apr 14, 2022

Copy link to clipboard

Copied

This code works great when a PDF is open in the default Acrobat, but if you open it in a web browser (some users default here) it ignores the stroke and fill colour when there is a value entereed and it stays red. Do you know how to stop this?

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Apr 14, 2022 Apr 14, 2022

Copy link to clipboard

Copied

LATEST

There's no solution to that. You need to instruct your users to open the file in Reader if they want it to work properly.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Apr 14, 2022 Apr 14, 2022

Copy link to clipboard

Copied

"Thank you - I get a SyntaxError:syntax error 2:at line 3"

Sorry.

 

"do you know how to make it apply to check boxes too?"

The principle is the same but as checkboxes don't have "Validate" nor "Calculation" it is necessary to execute the script from another field.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines