Adobe LiveCycle (Archived)

Permalink · 8/1/13

Hi there,

I am using LiveCycle ES3. I would like to insert at the end of my form (standalone form, NOT a web form) a button which allows the user to check their form for errors, then display a list of the errors and highlight the fields which have the errors. Lastly, it should unhighlight these fields when the errors have been fixed.

Also, within the form, if the user makes certain selections, they are required to include an attachment with their form. I would like to make it so when they make selections requiring an attachment, a field is generated at the end of the form which lists out all of the required attachments. Is this possible?

Thank you.

Jono_Moore · 8/8/13

The validate button is calling a Script Object called "controller". If you look in the Hierarchy of the sample form under Variables there are two Script Objects: controller and validation. Script Objects are used for holding re-useable scripting functions.

You need to recreate those for the validation to work. If you right click on "form1" (or whatever your topmost node is called in the Hierarchy) you can select "Insert Script Object". You'll need to do that twice.

In the Hierarchy there will then be a Variables node with the two Script Objects. Name them the same as the sample form and copy and paste the scripts from the sample form into them.

View solution in original post

radzmar · 8/2/13

Here's a link to a set of samples from J.P. Terry.

In chapter 6 you'll find the "HighlightRequiredFields.pdf", which contains all you need.

http://www.smartdoctech.com/zip/LC%20Designer%20Demo%20Files.zip

Permalink · 8/7/13

That was helpful! I used some of the demos to add more functionality to my form. However, I cannot get the "Validate Form" button to work in my form. I opened the demo form in LiveCycle, copied the "Validate Form" button into the "ContentArea" in my form, and kept the same script for it (below) on the Click event:

Script: controller.validateForm(1)

To test, I made sure that some fields are marked as "Required" and that the "Error" box for them is checked in the Object > Value > Validation Script Message palette. However, when I preview the PDF, leave the required fields blank, and click the validate form button nothing happens.

What am I doing wrong?

Jono_Moore · 8/8/13

The validate button is calling a Script Object called "controller". If you look in the Hierarchy of the sample form under Variables there are two Script Objects: controller and validation. Script Objects are used for holding re-useable scripting functions.

You need to recreate those for the validation to work. If you right click on "form1" (or whatever your topmost node is called in the Hierarchy) you can select "Insert Script Object". You'll need to do that twice.

In the Hierarchy there will then be a Variables node with the two Script Objects. Name them the same as the sample form and copy and paste the scripts from the sample form into them.

Permalink · 8/8/13

Brilliant. Worked like a charm! Thank you! Now, how do I make it so unchecked checkboxes also show up as highlighted when the user clicks the "Validate Form" button? For example, one section may have three checkboxes, wherein at least one of the checkboxes must be checked. If none of the checkboxes is checked, then when the user clicks "Validate Form", the section with the checkboxes should be highlighted.

Jono_Moore · 8/8/13

You have to script checkboxes to make them mandatory.

On the Initialize even of the checkbox put:

this.mandatory = "error";

If the filler only needs to select 1 of a set of checkboxes you'll need to script turning mandatory off on the other checkboxes when one of them is selected:

checkboxname.mandatory = "disabled";

I don't have ES3 but I know they added more robust validation options in that version. I'd read up on it the docs.

Permalink · 8/8/13

I added these scripts.

Checkbox NO4C - Initialize Event:
if(this.rawValue =='0')
{
YES4C.mandatory = "error";
}

if(this.rawValue =='1')
{
this.mandatory = "disabled";
}

Checkbox YES4C - Initialize Event:
if(this.rawValue =='0')
{
NO4C.mandatory = "error";
}

if(this.rawValue =='1')
{
this.mandatory = "disabled";
}

This marks the checkboxes as required when I view my PDF, however when I run "Validate Form", even if one of the checkboxes is checked, it still shows them as being required (highlighted in yellow). It doesn't do this for the text fields. For example, when "Validate Form" shows me that a text field is required (with yellow highlighting), when I enter text in the field, and re-click "Validate Form", the field is no longer highlighted. I would like the same to happen when I check one of the required boxes. It should no longer show me that there is an error in that checkbox section. Please help.

Jono_Moore · 8/8/13

On the Initialize event you just want this.mandatory = "error"; This sets the mandatory flag for them when the form is opened.

Disabling the other checkboxes would be done from the Change event on the checkbox.

You don't have to explicitly turn off mandatory on the first checkbox clicked because by being clicked it will no longer trigger a validation error.

So on your the Initialize event for all the checkboxes:

this.mandatory = "error";

On the Change event of all the checkboxes you need to set the other checkboxes to "disabled" when that checkbox is selected. So using NO4C if it is checked then:

YES4C.mandatory = "disabled";

Permalink · 8/8/13

You, sir, are a lifesaver. Thank you so much!

Permalink · 8/8/13

Okay, I found a way for the user to get around the required checkboxes. Say there's a section with Yes/No checkboxes, like I described above. When the form is first opened up, the checkboxes in the section are marked as required by the checkboxes both being highlighted. That works perfectly. If the checkboxes are left blank and the user clicks "Validate Form", then the checkboxes remain highlighted as required. That works perfectly as well. However, if the user checks either "Yes" or "No", but then unchecks them, leaving both of the checkboxes blank, then the form no longer considers the checkboxes as being required. The checkboxes are no longer highlighted and clicking "Validate Form" no longer highlights them as well. Is there a way to fix this gap?

Jono_Moore · 8/9/13

So you need to test the value of the other checkbox and set mandatory accordingly.

I think something like the following will work, you might need to play around with it. If you have a bunch of checkboxes though it could get unwieldy.

On the Change event (I'm using CheckBox1 and CheckBox2):

//checkbox1
if (this.rawValue == 1 && CheckBox2.rawValue == 0){
          CheckBox2.mandatory = "disabled";
}
else {
          CheckBox2.mandatory = "error";
}
//checkbox2
if (this.rawValue == 1 && CheckBox1.rawValue == 0){
          CheckBox1.mandatory = "disabled";
}
else {
          CheckBox1.mandatory = "error";
}

Permalink · 8/9/13

Thanks again for the reply! I found that by adding just a little script after yours I got exactly what I wanted:

//checkbox1

if (this.rawValue == 0 && checkbox2.rawValue == 0){

checkbox1.mandatory = "error";

checkbox2.mandatory = "error";

}

//checkbox2

if (this.rawValue == 0 && checkbox1.rawValue == 0){

checkbox1.mandatory = "error";

checkbox2.mandatory = "error";

}

This makes it so even if the user, for whatever reason, checks one of the boxes then decides to uncheck it, checks the other box, and for whatever additional reason, unchecks that one too, leaving both boxes unchecked, that both checkboxes then show up as still being required, and will also show up as highlighted when clicking the "Validate Form" button. I know, kinda dummy proof, but I'm trying to limit errors the best I can. Error follow-up for little things like this is a huge time-suck here.

Permalink · 8/26/13

Hey Jono,

I'm checking back in about the "Check form for errors" button. I got this to work great in my form. Only remaining issue I have is that after it's run by the user, the fields remain highlighted in yellow even after the user fixes them and re-clicks the button. I would like the fields to default back to their original color once the user has corrected them. Can you tell where I need to revise my script please?

form1.#variables[0].controller - (JavaScript, client)

function validateField(name, val, fldlength, pattern, required){
var errMsg = "";

if(required && (val == null || val == "")){
errMsg = name + " " + isrequired.value + "\n";
}

return errMsg;
}

if (showMsg && vMsg.length>0) {
vMsg += "are required";
vMsg = "Please fill in the required fields that are highlighted in yellow. If the 'Highlight Fields' feature is enabled, the required fields will instead be indicated by a red border."
xfa.host.messageBox(vMsg);
return false
}
return true;
}

function highlight(formElem){
try {
var fieldObj = xfa.resolveNode(formElem);
var fld = null;
var noBorder = false;
fld = fieldObj.ui.resolveNode("#textEdit");
if (fld != null){
   noBorder = true;
}else
   fld = fieldObj.ui.resolveNode("#checkButton");

if (fld == null)
   fld = fieldObj.ui.resolveNode("#choiceList");

if (fld != null){
   fld.border.presence = "visible";

   if (noBorder)
    fld.border.edge.presence = "visible";

   fld.border.fill.color.value = "255,255,128";
}

if (fld == null)
   fld = fieldObj.ui.resolveNode("#dateTimeEdit");

if (fld != null){
fld.border.presence = "visible";

if (noBorder)
fld.border.edge.presence = "visible";

   fld.border.fill.color.value = "255,255,128";
}
}catch (oErr){
app.alert("Exception in Highlight: " +   "FormElem: " + formElem + " : " +   oErr.name + " - " + oErr.message);
   }
}

function nonHighlight(formElem){
try {
var fieldObj = xfa.resolveNode(formElem);
var fld = null;
var noBorder = false;

fld = fieldObj.ui.resolveNode("#textEdit");
if (fld != null)
   noBorder = true;
else
   fld = fieldObj.ui.resolveNode("#checkButton");

if (fld == null)
   fld = fieldObj.ui.resolveNode("#choiceList");

if (fld != null){
   fld.border.presence = "visible";

   if (noBorder)
    fld.border.edge.presence = "visible";

   fld.border.fill.color.value = "255,255,255";
}

if (fld == null)
   fld = fieldObj.ui.resolveNode("#dateTimeEdit");

if (fld != null){
   fld.border.presence = "visible";

   if (noBorder)
    fld.border.edge.presence = "visible";
   fld.border.fill.color.value = "255,255,255";
}
}catch (oErr){
app.alert("Exception in Highlight: " +   "FormElem: " + formElem + " : " +   oErr.name + " - " + oErr.message);
   }
}

function highlightTest(fieldObj){
try {
var fld = null;
var noBorder = false;

fld = fieldObj.ui.resolveNode("#textEdit");
if (fld != null){
   noBorder = true;
}else
   fld = fieldObj.ui.resolveNode("#checkButton");

if (fld == null)
   fld = fieldObj.ui.resolveNode("#choiceList");

if (fld == null)
   fld = fieldObj.ui.resolveNode("#numericEdit");

if (fld == null)
   fld = fieldObj.ui.resolveNode("#dateTimeEdit");

if (fld != null){
   fld.border.presence = "visible";

   if (noBorder)
    fld.border.edge.presence = "visible";

   fld.border.fill.color.value = "255,255,128";
}
}catch (oErr){
app.alert("Exception in Highlight: " +   "FormElem: " + formElem + " : " +   oErr.name + " - " + oErr.message);
   }
}

function nonhighlightTest(fieldObj){
try {
var fld = null;
var noBorder = false;

fld = fieldObj.ui.resolveNode("#textEdit");

if (fld != null){
   noBorder = true;
}else
   fld = fieldObj.ui.resolveNode("#checkButton");

if (fld == null)
   fld = fieldObj.ui.resolveNode("#choiceList");

if (fld == null)
fld = fieldObj.ui.resolveNode("#numericEdit");

if (fld == null)
   fld = fieldObj.ui.resolveNode("#dateTimeEdit");

if (fld != null){
   fld.border.presence = "visible";

   if (noBorder)
    fld.border.edge.presence = "visible";

   fld.border.fill.color.value = "255,255,255";
}
}catch (oErr){
app.alert("Exception in Highlight: " +   "FormElem: " + formElem + " : " +   oErr.name + " - " + oErr.message);
   }
}

Jono_Moore · 8/27/13

It's not my script, so I'm not really sure what's going on.

You could try forcing an xfa.layout.relayout() maybe and see if it refreshes the colours?

Permalink · 8/28/13

Where would I place that script?

Jono_Moore · 8/28/13

I'd try it as the last line of script on your validate button.

I just went back and tested the sample form from the book and it works fine without a relayout call so I'm not sure what the problem is.

The book is worth picking up if you are learning Designer. It's called Creating Dynamic Forms with Adobe LiveCycle Designer by J.P. Terry.

Permalink · 8/28/13

I couldn't get the relayout script to do anything, unfortunately. I placed it in the click event of the validate button.

I'm not sure what the problem is either. Aside from changing the error message that pops up when the user clicks the validate button, I didn't alter the script from the demo file at all. As far as I can tell, my form's hierarchy is set up about the same way as the demo. I guess I'll keep fiddling around with it.

Permalink · 8/28/13

After experimenting it appears that the issue may be related to the number of pages. In the sample form that works correctly, there is only one page. However, in my form, there are seven pages. When I edited the sample form to make it two pages instead of just one, the validation button no longer cleared fields of their highlighting after they were fixed. Any ideas now?

Jono_Moore · 8/29/13

No idea, from looking at the script it looks like it should handle multiple pages fine.

There is another set of script objects by John Brinkman which I know do a good job as I've used them. They do validation among other things. I mentioned them in another thread to you earlier here: http://forums.adobe.com/message/5497792#5497792

They are more complex to use but fairly easy to get the hang of.