Last updated:
Validation with JavaScript lets you implement user-defined validation logic for your forms. Unlike the standard validation for individual form elements, this method permits the simultaneous checking of multiple items of input and their relationships to one another.
Usage examples:
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
}
You use the validate()
function to define your own client-side checks in the browser.
In the page properties, a Validation area is provided for you to store your validation scripts.
validate()
function with the necessary validation logic.
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 |
|
|