Last updated:
JavaScript gives you a way to validate input for several form elements at the same time and create relationships between them. Since you can use all of the operations and functions offered by JavaScript, you can make things as simple or complex as necessary.
Access to the form elements – and therefore to the input that users make into the form – is handled in JavaScript using the technical name of the respective form element.
All forms permit the definition of a validation script on each form page. Forms include a prepared validation function for this purpose, with the name validate(). This function is executed automatically when users switch to a different form page or submit the form.
function validate() {
// Your validation logic is placed here
}
In the page properties, a Validation area is provided for you to store your validation scripts.
validate() function with the necessary validation logic.
JavaScript makes it easy to access the data in your forms:
Formcentric provides you with the following additional JavaScript functions for handling date values and drop-down lists:
The JavaScript parseDate function converts the value of an input field into a JavaScript object of the Date type.
For this to work, you need either an input field that is validated with the Date validator or the 'Date' form element, where users can enter a date.
The JavaScript parseAge function calculates a person’s age based on their date of birth.
For this to work, you need either an input field that is validated with the Date validator or the 'Date' form element, where users can enter the birthdate.
The JavaScript isEmptyList function checks whether a selection was made from a form field in which users can make a selection, i.e. from a drop-down list or a single or multiple choice field.
The JavaScript isSelected function checks whether users have selected a specific option from a specified drop-down list or single/multiple choice field.
Example 1: Age restriction for a newsletter |
|
| With this JavaScript, you can check whether people subscribing to a newsletter are at least 16 years old. Set up the following form elements in the form. | |
|
|
| Label | Date of birth |
| Technical name | birthday |
| Validation | Date |
| Date format | dd.MM.yyyy |
Single choice field for newsletter subscription |
|
| Label | Newsletter subsription |
| Technical name | newsletter |
| Options |
|
| On the form page, activate validation and select the ‘JavaScript’ option. Then execute the following validation script. | |
Validation script for age check |
|
function validate() {
var age = parseAge("dd.MM.yyyy", birthday);
if (isSelected(newsletter, "Yes") && age < 16) {
return "To subscribe to the newsletter, you must be at least 16 years old.";
}
return "";
}
What the validation does |
|
Example 2: Postcode only with town |
|
| In this example, none of the JavaScript functions described above are actually used. Instead, a simple validation logic is used that merely checks the relationship between the postcode and town fields. | |
|
|
| Label | Town |
| Technical name | town |
Input field for postcode |
|
| Label | Postcode |
| Technical name | postcode |
| Validation | Postcode |
| On the form page, activate validation and select the ‘JavaScript’ option. Then execute the following validation script. | |
Validation script |
|
function validate() {
if (town != "" && postcode == "") {
return "Please also enter a postcode.";
}
return "";
}
if (postcode != "" && town == "") {
return "Please also enter a town.";
}
return "";
}
What the validation does |
|
