Invalid Flashing Fields

So what’s the use of learning about new toys like “AcroForm Objects”:http://blogs.adobe.com/formbuilder/2006/06/acroform_objects.html and “AcroForm Field Name Generators”:http://blogs.adobe.com/formbuilder/2006/06/acroform_field_name_generator.html if you don’t take the time to play with them? Today felt like the right day to do just that and I came-up with a sample form where invalid fields flash red until the user has entered valid values into them. Only once all fields are valid can the form be submitted.

%{color:red} *Update:* Check-out the newer version on the new “Invalid Flashing Fields 2.0″:http://blogs.adobe.com/formbuilder/2006/08/invalid_flashing_fields_2.html post. %

“Download Sample [pdf]“:http://blogs.adobe.com/formbuilder/samples/AcroFormObjects/InvalidFlashingFields.pdf

*Minimum Requirements:* Designer 7.1, Acrobat 7.0.5.

*Note:* A basic understanding of “AcroForm Objects”:http://blogs.adobe.com/formbuilder/2006/06/acroform_objects.html is required for this sample.


The sample form works like this: When the user clicks on the Submit button, there’s a script which looks at all fields on the form and validates them for valid content. In this particular form, the only requirement is for the fields to be filled (i.e. have non-null values). If all fields are filled, the form is them submitted however, if there’s at least one field which isn’t filled, the first-found non-filled field is set to flash red until the user has filled it.Since XFA doesn’t natively support flashing fields, this is all done using the Acrobat _app_, _Document_ and _Field_ objects, discussed in greater detail in my previous post on “AcroForm Objects”:http://blogs.adobe.com/formbuilder/2006/06/acroform_objects.html, as well as my “AcroForm Field Name Generator”:http://blogs.adobe.com/formbuilder/2006/06/acroform_field_name_generator.html code.When a non-filled field is found, the Submit button’s script will get the AcroForm Field object name for the invalid field and use it to generate a small script which will run every time an Acrobat Timer object expires. This timer is created in the following block of code:bc. moFlashTimerID = app.setInterval(“var f = this.getField(‘GetAcroFormFieldName(oField)’);” +”if (color.equal(f.fillColor, color.red))” +”{ f.fillColor = [" + moAcroFieldFillColor.toString() + "]; }”"else” +”{ f.fillColor = color.red; }”,500);In this block of code, the Acrobat app object’s _setInterval_ method is used to create a timer which will continously expire at a specific interval (in this case, every 500 milliseconds, or 0.5 seconds) and every time it expires, it’ll execute the code specified in the first parameter. Since the timer’s code will execute within the context of the document from which the _setInterval_ method was called, the _this_ keyword will represent Acrobat Document object pertaining to the form. The _GetAcroFormFieldName_ method can then be used to get the AcroForm Field object name pertaining to the invalid field ([_oField_]) which is then passed to the Acrobat Document object’s _getField_ method. From there, the AcroForm Field’s fill color is compared to red: If it’s already red, it’s set to a light gray color; otherwise, it’s set to red.It’s important to note that the _setInterval_ method returns an Acrobat Interval object which can subsequently be used to cancel the interval timer in order to get the field to stop flashing red once the user has filled it with a value. This object is also required in order to *ensure the timer is stopped when the form is closed* if the user ever decides to close the form while an invalid field is flashing (see the code in the root subform’s (form1) DocClose event).====~*Updated:* August 15, 2006~