-
- Show or Hide Form Fields Based on User Joomla User Group
- Disabling Browser Autocomplete for Form Fields
- Scroll the Page to the Top When a Long Form is Submitted
- Display Submissions Count for a Specific Form
- Populate Drop Down, Radio Buttons or Checkboxes with a CSV File
- Automatically Delete Submissions Older Than X Days
- Silently POST Submitted Data to Any API or URL
- Automatically Save Each Submission to a JSON file
- Authenticate and Login a User with a Custom Joomla Form
- Auto-Populate a Form Field with an Article Data
- Add a placeholder text to a Dropdown
- Create Multilingual Forms in Joomla
- Create a custom Joomla User Registration Form
- Redirect User to a URL After Form Submission
- Export and Import Forms across different Websites
- Export Form Submissions to CSV
- Convert Forms
-
- How to Create a Quiz Form
- Displaying a Popup After Form Submission Using EngageBox
- Conditional Content Shortcode in Convert Forms
- Copy Value From One Field to Another
- Tasks
- Export Form Submissions with a Webhook URL
- Conditional Fields
- PDF Form Submissions
- Input Masks
- Field Calculations
- Auto-Populate Form Fields Using Query String
- Use Smart Tags
-
- Enable Minimum Time to Submit
- Restrict Form Submissions Based on IP
- Enforcing a Custom Password Policy in Convert Forms
- Add Cloudflare Turnstile to your Joomla Form
- Implement the Iubenda Consent Database in Joomla with Convert Forms
- Add Custom Validations to Fields and Forms
- Add Math Captcha to your Form
- Prevent a Field From Saving in the Database
- Add hCaptcha to your Form
- Enable Double Opt-in
- Allow Form Submissions in Specific Date Range
- Ensure a Unique Value is Entered Into a
- Block Form Submissions Containing Profanity (Bad Words)
- Block Email Addresses or Email Domains
- Add Honeypot Protection
- Setting Up Google reCAPTCHA
- Create GDPR Compliant Forms
Add Custom Validations to Fields and Forms
In Convert Forms, you can create custom field validation rules that can be implemented on both the client and server sides to ensure data integrity and security.
Client-Side Validation
Client-side validation employs JavaScript to validate user input directly within the browser before the data is submitted to the server. This allows for immediate feedback to users, enhancing user experience. To implement client-side validation, you need to listen for the form's beforeSubmit event and validate the fields accordingly, as illustrated in the example below:
ConvertForms.Helper.onReady(() => {
form.addEventListener('beforeSubmit', (event) => {
if (inputConditionHere) {
event.preventDefault();
event.detail.error = 'Your custom message here';
}
});
});
Let's see some examples:
Validate Input Maximum Characters
This example demonstrates an error message that appears when the input exceeds the specified character limit.
var formID = 160;
var inputName = 'email';
var maxChars = 10;
var error = 'Maximum character limit reached.';
ConvertForms.Helper.onReady(() => {
var form = document.querySelector('#cf_' + formID);
form.addEventListener('beforeSubmit', (event) => {
var input = form.querySelector('input[name="cf[' + inputName + ']"]');
if (input.value.length > maxChars) {
event.preventDefault();
event.detail.error = error;
}
});
});
Server-Side Validation
Server-side validation, on the other hand, is implemented using PHP. This validation occurs on the server after the form data is submitted. Server-side validation is crucial for security and data integrity, as it ensures that even if client-side validation fails or is bypassed, the server still enforces validation rules.
To implement server-side validation with PHP, you must place the PHP snippet into the PHP Scripts -> Form Prepare option. Use the $post (Array) variable to access the submission data. To display a custom error message, throw an exception like in the example below:
if (someConditionHere == 'VALUE')
{
throw new Exception('Your custom error message here');
}
Let's see some examples:
Validate Input Maximum Characters
This example demonstrates an error message when input exceeds the specified character limit but takes place on the server side.
$maxChars = 50;
$inputName = 'message';
$error = 'Maximum character limit reached.';
if (strlen($post[$inputName]) > $maxChars)
{
throw new Exception($error);
}
Ensure Your Form Accepts a Limited Number of Submissions
In this example, you can set your form to accept a specific number of submissions. An error message will prompt once this limit is reached, indicating that no further submissions can be accepted.
// Set the maximum submissions accepted
$max_submissions = 40;
// Specify the error message to reach maximum submissions.
$error = 'We do not accept further submissions.';
// Do not edit below
if (ConvertForms\Form::getSubmissionsTotal($form['id']) >= $max_submissions)
{
throw new Exception($error);
}
Advanced Examples
Here's a list of advanced server-side validations real use cases.