Expand my Community achievements bar.

Dive into Adobe Summit 2024! Explore curated list of AEM sessions & labs, register, connect with experts, ask questions, engage, and share insights. Don't miss the excitement.

Check for required fields without clicking anything

Avatar

Level 5

Is there a way to add a script to a Submit to check if all required fields have content?  I would like the button to turn green as soon as all fields are completed.  All required fields are on "Page 1".  Thanks for any help!

5 Replies

Avatar

Level 7

I like this. A reason to use the calculate event on a button!

I'll let you work out how you would want to check the required fields (since I don't know how you set them up), but here's an example where we check for a field being empty. Multiple if statements could be used for the other required fields.

btnSubmit::calculate


var incomplete = false;


if (tfSomething.isNull) incomplete = true;


//Put more if statements here if you just want to do it this way.


//Otherwise you need to loop through all of them and look at their


//nullTest value: if (tfSomething.validate.nullTest == "error") { }


if (incomplete) this.fillColor = "255,0,0";


else this.fillColor = "255,0,0";


Avatar

Level 5

I came up with something quite different.  Could you look this over and see if there's a flaw in the logic? It's in the "ready:layout" event of Submit button.  It seems to work, but I would appreciate another opinion.


if (Page1.execValidate() == true)  {


  this.fillColor = "0,128,0"; //green fill


  this.caption.font.fill.color.value = "255,255,255"; //white font


  }


  else  {


  this.fillColor = "240,240,240"; //gray fill


  this.caption.font.fill.color.value = "70,70,70"; //dark gray font


  }


And, if you don't mind, could you explain the logic in line 2 of your script?  I don't understand what it's testing for there.  Thanks again.

Avatar

Level 7

So, in your version, you rely on the ready::layout event. That should work well since you're using the built-in validate function.

In my version the condition is just checking that there is something in a text field called tfSomething. I didn't know if you had set validation rules in you form. You'd have to put in a line to check each field you want to verify to ensure the form is ready. For instance, if you have 20 fields, but only really want to check 2, then you use a check like this with two fields to set the Boolean created in line 1.

Avatar

Level 5

OK, good, thanks for that explanation.  Makes sense now.  That sounds like a good option if you have a few fields in different areas that you need to make sure are completed before submitting.

Avatar

Level 5

Hey jasotastic81, I thought you might be interested in this.  I took it one step further -- I made the Submit button non-functional, using the "access" property, until all required fields have input.  Then it turns green and becomes enabled.  It seems to work nicely.


if (Page1.execValidate() == true)


  {


  this.fillColor = "0,128,0"; //green fill


  this.caption.font.fill.color.value = "255,255,255"; //white font


  this.access = "open";


  }


  else


  {


  this.fillColor = "240,240,240"; //gray fill


  this.caption.font.fill.color.value = "70,70,70"; //dark gray font


  this.access = "readOnly";


  }