Skip to main content
Participant
December 31, 2020
Answered

Submit Button Highlights Filled In Required Fields

  • December 31, 2020
  • 4 replies
  • 12174 views

I have a form with several required fields. When the submit button is clicked and ONE of the required fields is blank an error message is displayed "At least one required field was empty. Please fill in the required fields (highlighted) before continuing". The issue is that ALL of the required fields are highlighted even if they are not blank. Is there a way to highlight just the field(s) that are blank? 

Correct answer ls_rbls

You can try with a mouse-up event action script like :

 

// loop through all fields in the document

for ( var i=0; i < this.numFields; i++) {

//get the field names and declare variables
var fname = this.getNthFieldName(i);
var f = this.getField(fname);


/*establish a condition, if the field is not a button type object, and fields are marked as required but the value is empty */

if (f.type != "button" &&  f.required == true) {

if (f.value == "") {


//trigger an alert for the user to identify which fields are empty

app.alert({

cMsg: "Please complete required field(s) before submitting this form: " + f.name,

cTitle: "Required Fields Check "});

}
} 

 

This is just a very small example of this type of script. You can add more to it.

 

 

4 replies

Participant
November 3, 2023

I know I am late to the game. I have the same error message, when I run the Java script it says: SyntaxError: 1:Console:Exec undefined?

Help

ls_rbls
Community Expert
Community Expert
November 12, 2023

HI @Yvonne33372078ja52 ,

 

Would you mind sharing the script that you're using? Or better yet, a copy of your PDF (if you can).

Participant
January 8, 2021

This was effective, thanks so much.

There is still one slight issue. Error messages pop up for all blank fields, but then the default message "At least one required field was empty. Please fill in the required fields (highlighted) before continuing" also appears the last time OK is clicked. Is there script that could be added so the default message doesn't appear? I'm not really familiar with Java so I very much appreciate the help.

ls_rbls
Community Expert
Community Expert
January 8, 2021

You're welcome.

 

That seems to be a buitl-in system messaging app when the submit form action is used, and it takes precedence over any custom script JavaScript if both actions (the script or built-in submit form action) are triggered from the same button. So, it was very difficult for me to figure out  how to supress that alert via scripting.

 

What probably could work to avoid this, is to make two buttons; one button visible and one button hidden.

 

The main button (visible) could have an condition that when it runs the script that checks for the empty required fields, and if they're all filled in then second button becomes visible so that the user just clicks on it and submit.

ls_rbls
Community Expert
Community Expert
January 1, 2021

++Adding to AkanchaS guidance,

 

You can  also add a JavaScript  mouse-up event action to that button to check for the fields that are marked as required but not empty and  those that are marked as required but empty, and pop an alert message to encourage the user to complete filling in those empty required fields before the Submit action is executed.

 

That said, if you select to submit the form exported  as an FDF file.

 

Under this export option, the Submit action allows you to select an additional option to send the form with empty fields marked as required.

 

You won't get that option if you opt to send the entire dopcument exported as PDF.

 

See slide below:

 

Participant
January 2, 2021

Thank you for your response.

 

The form does not have any hidden mandatory fields. The users are using Acrobat Reader to fill in the form.

 

Would you or anyone else by chance have an example of the JavaScript  mouse-up event action script? 

ls_rbls
Community Expert
Community Expert
February 3, 2023

Thanks ls_rbls

I'm only using 2 radio buttons on this form. The idea is; the form gets sent out to reps. as a master form file. Then when an order comes in, they open it, pick one of the 2 radio buttons, fill in all the information and then save it under a different name. So the master file will always have the 2 radio buttons off/unchecked.

 

Any suggestions on what to add to the script to make it check the radio buttons? I have zero experence writing script.

Thanks


If you're using the exact same script as the example that I posted months ago, just declare a variable for the radio buttons and add an additional condition as shown below:

 

// loop through all fields in the document

for ( var i=0; i < this.numFields; i++) {

//get the field names and declare variables
var fname = this.getNthFieldName(i);
var f = this.getField(fname);

var g = this.getField("myRadioButton");

/*establish a condition, if the field is not a button type object, and fields are marked as required but the value is empty */

if (f.type != "button" &&  f.required == true) {

if (f.value == "" || g.value !=="Off") {

//trigger an alert for the user to identify unchecked radio buttons and which fields are empty

app.alert({

cMsg: "Please verify that the radio buttons provided are checked and that all of the required field(s) are filled before submitting this form: " + f.name,

cTitle: "Required Fields Check "});

}
} 

 

NOTE:

 

make sure that the radio button field name match yours; in my example variable I named the group pair of radio buttons "myRadioButton"

 

In addition, for this to work you must make these radio buttons mutually exclusive.

 

Assign the same field name to both radio buttons but use different export value on each radio button.

 

For instance, you may assign "1" for the first radio button' export value and "2" for tge second radio button.

 

Since the default value of an unchecked radio button (or checkbox) is "Off", the line of script that I added will evaluate the unchecked state of the radio button.

 

In other words,  if any of the required fields is empty OR a radio button is not checked, the script will first evaluate empty required fields and then evaluate if the value of the radio buttons is "Off".

 

If any of these conditions are met it will trigger the alert for the user to take corrective action.

 

See if this works for you.

AkanchhaS8194121
Legend
January 1, 2021

Hi,

 

While creating the form, did you create there any hidden manadatory fields ? Please cross check and see if there is any hidden mandatory fields and you might have applied the same settings to all the form fields available there.

The end users who are filling the form, do they fill it within Acrobat/Reader desktop app or on web browser?

 

Thanks,

Akanchha