Using JavaScript to validate a newsletter subscription
This guide explains how to use JavaScript to implement an age check for newsletter subscriptions. This validation ensures that only individuals aged 16 and over can subscribe to the newsletter.
Principle
If users have not yet reached the required minimum age, they will be able to complete and submit the form but they will not be able to subscribe to the newsletter. They will receive an error message if they try to submit the form with the newsletter subscription checked or attempt to navigate to the next page. This error message tells them that they have not yet reached the minimum age required for the newsletter subscription.
Main form elements
The JavaScript validation makes use of two main form elements:
The input field for the date of birth (technical name: ‘birthday’). This field validates the date input in the format ‘dd.MM.yyyy’ and checks for a minimum age of 16 years.
A single choice field for the newsletter subscription (technical name: ‘newsletter’) with ‘Yes’ as the option value to be checked. The validation result from the date of birth directly influences this single choice field: a newsletter subscription is possible only if the minimum age is reached. Otherwise, the form can only be submitted without a newsletter subscription.
Form elements required
The following form elements are required for the age check.
Input field for date of birth
Technical name: birthday
Date format: dd.MM.yyyy (important: select the format from the corresponding dropdown) Example: 01.03.2000 for 1 March 2000
Function: The user enters their date of birth into this input field. The age is calculated automatically and checked to confirm that the person is at least 16 years old.
Single choice field for newsletter
Technical name: newsletter
Value to be checked: Yes
Function: The user checks this field to confirm their newsletter subscription.
Inserting JavaScript code
To implement the age validation, enter the following JavaScript code into the validation text field in your form:
How to use the code
Open the form page with the input field for the date of birth and the single choice field for the newsletter.
Go to the Validation section.
If necessary, move the Validation slider to the right to activate the function.
Select the JavaScript option.
In the validation script field, enter the code block for the validate() function inside the curly brackets.
What this code does
The parseAge() function calculates the age based on the date of birth entered.
The validation checks two conditions:
Is the newsletter option ‘Yes’ selected?
Is the calculated age less than 16 years?
Possible results
Case 1: Newsletter selected AND age <16
Error message is shown
Form cannot be submitted
Case 2: All other results
No error message
Form can be submitted normally
Testing the validation
After setting up the form, test the following scenarios to confirm that the form works as required:
User aged 16 or above with newsletter subscription
User aged under 16 with newsletter subscription
User aged under 16 without newsletter subscription
Please use the feedback form to contact us if the form does not work as expected or if you have any other questions.