Developer

Form guard API & developer implementation

While the Form Guard is designed for easy use requiring only a simple copy-paste and no coding there are several advanced features available through the Form Guard SDK that can be utilized on the client side. These capabilities are intended for advanced users who are comfortable writing and customizing JavaScript code.

Note: Writing incomplete or syntactically incorrect code can break Clearout's Form Guard functionality on your forms. Always test custom scripts thoroughly in a sandbox environment before deploying them to production.

Getting Started with the Basics

How to ensure the Clearout's JS has loaded correctly on the page?

Once you've added Clearout's JS code to your page, refresh the page and open the browser console.

You should see the below-mentioned log message indicating that Clearout's SDK has been successfully initialized along with the version.

This log ensures that the Form Guard is active and ready to perform validations on your page.

Enabling debug mode & inspect options

Enabling Debug Mode provides detailed and descriptive logs in the browser console. These logs include insights such as

• Field detection and validation processes

• API request and response details

• Error messages and warnings

• Performance metrics

To enable debug mode, you can override the options in your JavaScript code:

<script>
    function onCoJSScriptLoaded() {
      console.log('Clearout JS Loaded - Overriding Options!!');
      window.clearout.options.debug = true
      window.clearout.options.inspect = true
    }
</script>
<script id="clearout-js-widget" src="https://clearout.io/jswidget/{your_app_id}" async onload="onCoJSScriptLoaded()"></script>

Note: Debug mode should only be enabled in development environments as it may impact performance and expose sensitive information.

Basic Configuration

Overriding Options

In Clearout's Form Guard, settings are managed through the Clearout Dashboard. However, you can override these settings on the client side if needed. For example:

<script>
  function onCoJSScriptLoaded() {
    console.log('Clearout JS Loaded - Overriding Options!!');
    window.clearout.options.mode = 'formSubmit'
    window.clearout.options.email.block_free_account = true
    window.clearout.options.email.feedback_free_account_message = 'Free email accounts are not allowed :('
  }
</script>
<script id="clearout-js-widget" src="https://clearout.io/jswidget/{your_app_id}" async onload="onCoJSScriptLoaded()"></script>

This will force the Form Guard to use FormSubmit mode and block free email accounts, regardless of the dashboard settings.

Custom Form Selection

The window.clearout.options.form_elements option allows you to specify which form elements on the page require validation. This is particularly useful for div-based or non-standard forms or custom form implementations.

window.clearout.options.form_elements = [
  {selector:'#custom-form-container'}, // treats this id selector as a form with default widget options
  {selector: '.dynamic-form-wrapper', options: {mode: 'formSubmit'}}, // treats this class selector as a form with formSubmit mode
  {selector: '[data-form-type="custom"]', options: {mode: 'ajax', email: {block_free_account: true}}} // treats this data-form-type attribute selector as a form with ajax mode and blocks free email accounts
];

Pre-filled Value Validation

The window.clearout.options.prefill_validation option enables validation of pre-filled values in form fields. This is useful when forms are pre-populated with data and you want to validate these values immediately.

window.clearout.options.prefill_validation = true;

Built-in Error Message Suppression

The window.clearout.options.suppress_form_builtin_error_message_selector option allows you to specify selectors for form elements whose built-in error messages should be suppressed. This helps prevent duplicate error messages when using Clearout's validation.

window.clearout.options.suppress_form_builtin_error_message_selector = '.form-error-message, .validation-message';

Phone Field Overlay

The window.clearout.options.phone.overlay option enables Clearout to create an enriched phone UI component over your form's existing phone field. This provides enhanced validation and formatting capabilities.

window.clearout.options.phone.overlay = true;

Form Discovery

The form discovery options allow you to configure the duration and interval for form discovery. This is useful when you have forms that are dynamically loaded on the page.

window.clearout.options.form_discovery_duration = 15000; // Max allowed time in millseconds to discover forms on page, set to -1 for infinite
window.clearout.options.form_discovery_interval = 500; // Interval time in milliseconds between form discovery attempts

Disabling Validation on Particular Fields

In some cases, you may want to exclude certain fields from Clearout's validation. This is particularly useful when you have duplicate fields (like email and confirm email) where validating both fields would be redundant.

To disable validation on a specific field, simply add the data-clearout-validation-disable attribute to the field element. The Form Guard will automatically ignore any fields with this attribute.

<form id="signup-form">
  <input type="email" name="email" placeholder="Enter your email">
  <input type="email" name="confirm_email" placeholder="Confirm your email" data-clearout-validation-disable>
  <button type="submit">Sign Up</button>
</form>

Note: This attribute is particularly useful for

• Confirm email fields

• Hidden fields that don't require validation

• Fields that are handled by other validation systems

• Fields that are temporarily disabled or read-only

Disabling Validation on Particular Form

In some cases, you may want to exclude validation for a specific form on the page.

To disable validation on a specific form, simply add the data-clearout-form-identifier=false attribute to the <FORM/> element. The Form Guard will automatically ignore the form with this attribute.

Available Options

Here are all the configurable options available in the Clearout FormGuard:

window.clearout.options = {
  api_url: config.API_URL,
  timeout: 10,
  mode: 'ajax',

  on_ready: null,
  form_elements: [], // changed
  suppress_form_builtin_error_message_selector: null,

  submit_button_cursor_style: 'pointer',
  submit_button_selector: null,

  auto_validation: true,
  prefill_validation: false,

  bot_detection: {
     enabled: false, // Boolean type - whether bot detection need to be performed during validation
     provider:null,  // String type - provider can be either Google reCaptcha or Cloudflare Turnstile
     data: null      // Object type - object to hold provider specific keys
   },

  feedback_google_recaptcha: 'Google Recaptcha Verification Failed',
  feedback_cloudflare_turnstile: 'Bot Validation Failed, Please refresh the page',

  inspect: false,
  debug: false,

  email: {
    elements: [],
    enabled: true,

    allow_safe_to_send_yes: false, // changed

    block_role_account: false,
    block_free_account: false,
    block_disposable_account: true,
    block_unknown_status: false,
    block_catchall_status: false,
    block_gibberish_account: false,
    block_form_submission_on_timeout: false,
    block_form_submission_on_limit_crossed: false,

    feedback: true,
    optional: false,
    selector: null,

    on_before_verify: null,
    on_after_verify: null,

    suggest_email: false,
    suggest_email_message_template: 'Did you mean __SUGGESTED_EMAIL_ADDRESS__?',

    feedback_invalid_classname: 'co-error-msg',
    feedback_invalid_message: 'Invalid email address',
    feedback_role_account_message: 'Invalid - Role account not allowed',
    feedback_free_account_message: 'Invalid - Free account not allowed',
    feedback_disposable_account_message: 'Invalid - Disposable account not allowed',
    feedback_unknown_message: 'Unable to verify the email address, try after sometime',
    feedback_catchall_message: 'Catch All email not acceptable, please enter a different email address',
    feedback_gibberish_message: 'Invalid - Gibberish email address not allowed',
    feedback_safe_to_send_only_message: 'Please enter different email, entered email is not safe',
    feedback_on_timeout_message: 'Email could not be verified - timeout occurred',
    feedback_on_usage_limit_crossed_message: 'Unable to verify the email address, usage limit crossed',
  },

  phone: {
    elements: [],
    enabled: false,

    block_mobile_numbers: false,
    block_landline_numbers: false,
    block_toll_free_numbers: false,
    block_voip_numbers: false,
    block_unknown_type: false,
    block_form_submission_on_timeout: false,
    block_form_submission_on_limit_crossed: false,
    allowed_countries: [],
    prefill_dial_code: false,

    selector: null,
    optional: false,

    on_before_verify: null,
    on_after_verify: null,

    feedback: true,
    feedback_invalid_message: 'Invalid phone number',
    feedback_invalid_classname: 'co-phone-error-msg',
    feedback_mobile_message: 'Invalid - Mobile numbers not allowed',
    feedback_landline_message: 'Invalid - Landline numbers Not allowed',
    feedback_toll_free_message: 'Invalid - Toll Free numbers not allowed',
    feedback_voip_message: 'Invalid - VOIP numbers not allowed',
    feedback_unknown_message: 'Invalid - Unknown numbers not allowed',
    feedback_on_timeout_message: 'Phone Number could not be verified - timeout occurred',
    feedback_on_usage_limit_crossed_message: 'Unable to verify the phone number, usage limit crossed',
  },

  name: {
    elements: [],
    enabled: false,
    gibberish_threshold: 'high',

    block_gibberish_name: true,
    block_form_submission_on_timeout: false,
    block_form_submission_on_limit_crossed: false,

    selector: null,
    optional: false,
    on_before_verify: null,
    on_after_verify: null,

    feedback: true,
    feedback_invalid_message: 'Invalid name',
    feedback_invalid_classname: 'co-name-error-msg',
    feedback_gibberish_message: 'Invalid - Gibberish name not allowed',
    feedback_on_timeout_message: 'Name could not be verified - timeout occurred',
    feedback_on_usage_limit_crossed_message: 'Unable to verify the Name, usage limit crossed',
  }
}

Search:

Field	Setting	Type	Default Value	Description
email	block_catchall_status	Boolean	false	Boolean to block form submission for emails with a catch-all status, where the mailbox accepts all addresses regardless of validity.
email	block_disposable_account	Boolean	true	Boolean to block form submission if the email is from a disposable or temporary email provider
email	block_form_submission_on_limit_crossed	Boolean	false	Boolean to block form submission when your app’s email validation usage limit has been exceeded.
email	block_form_submission_on_timeout	Boolean	false	Boolean to block form submission if the email validation request times out
email	block_free_account	Boolean	false	Boolean to block form submission for emails from free providers like Gmail, Yahoo, or Outlook.
email	block_gibberish_account	Boolean	false	Boolean to block emails identified as gibberish or invalid, preventing submission of nonsensical or fabricated addresses.
email	block_role_account	Boolean	false	Boolean to prevent form submission if the email is a role-based address (e.g., admin@, support@, info@)
email	block_unknown_status	Boolean	false	Boolean to block form submission if the email status couldn't be determined by Clearout
email	elements	Array	null	Allows you to specify an array of email validation configurations, each with a corresponding jQuery selector. This is particularly useful when you have multiple email fields on a page that require different validation rules. Each item in the array defines the selector for the input field and the specific validation settings to apply.
email	enabled	Boolean	true	Boolean to enable or disable email validation for the form
email	feedback	Boolean	true
email	feedback_catchall_message	HTML String	catch all email not acceptable, please enter a different email address	Option to provide a custom HTML string to be displayed when email status is catchall
email	feedback_disposable_account_message	HTML String	invalid - disposable account not allowed	Option to provide a custom HTML string to be displayed when disposable account is detected
email	feedback_free_account_message	HTML String	invalid - role account not allowed	Option to provide a custom HTML string to be displayed when free account is detected
email	feedback_gibberish_message	HTML String	invalid - gibberish email address not allowed	Option to provide a custom HTML string to be displayed when its a classified as a gibberish email
email	feedback_invalid_classname	String	co-error-msg	Option to add a custom CSS class to Clearout’s feedback HTML container for styling purposes.
email	feedback_invalid_message	HTML String	invalid email address	Option to provide a custom HTML string displayed when an invalid email is detected.
email	feedback_on_timeout_message	HTML String	email could not be verified - timeout occurred	Option to provide a custom HTML string to be displayed when validation timeout occurs
email	feedback_on_usage_limit_crossed_message	HTML String	unable to verify the email address, usage limit crossed	Option to provide a custom HTML string to be displayed when usage limit has crossed on your app
email	feedback_role_account_message	HTML String	invalid - role account not allowed	Option to provide a custom HTML string to be displayed when role account is detected
email	feedback_safe_to_send_only_message	HTML String	please enter different email, entered email is not safe	Option to provide a custom HTML string to be displayed when the email is not Safe to Send
email	feedback_unknown_message	HTML String	unable to verify the email address, try after sometime	Option to provide a custom HTML string to be displayed when unknown email is detected
email	on_after_verify	Function	null	Callback function executed immediately after Clearout’s validation completes, useful for handling post-validation actions.
email	on_before_verify	Function	null	Callback function executed immediately before Clearout’s validation starts, useful for performing pre-validation logic.
email	optional	Boolean	false	Boolean indicating if the email field is optional; when true, empty values are accepted and skipped during validation.
email	safe_to_send_only	Boolean	false	A super status option that allows only emails classified as “safe to send.” This is the strictest setting and overrides all other block rules.
email	selector	jQuery selector	null	Option to specify a jQuery selector to attach Clearout’s validation. Only needed if Clearout is unable to automatically detect the email field. This explicitly sets the target for validation when automatic detection fails.
email	suggest_email	Boolean	true	Boolean to enable displaying suggested corrections for common email typos as an error message.
email	suggest_email_message_template	HTML String	did you mean __suggested_email_address__?	Option to provide a custom HTML string for displaying suggested email corrections, where a placeholder is replaced with the suggested email address.
form	auto_discovery	Boolean	true	Enables or disables automatic detection and attachment of validation widgets to forms present on the page. When set to true, the widget will scan the DOM and initialize validation on all eligible forms automatically.
form	bot_detection	Object	bot_detection: { enabled: false, provider: null, data: null }	Enable bot protection for form submissions. Use Form Guard's automatic detection or an external provider such as Google reCaptcha v3.
form	debug	Boolean	false	Enables the generation of debug logs in the browser console. Useful for troubleshooting and monitoring validation behavior during development.
form	feedback_cloudflare_turnstile	HTML String	bot validation failed, please refresh the page	Specifies the error message displayed when Clearout Bot validation fails
form	feedback_google_recaptcha	HTML String	google recaptcha verification failed	Specifies the error message displayed when Google reCAPTCHA validation fails
form	form_discovery_duration	Number	15000	Specifies the maximum duration (in milliseconds) allowed for scanning the page to discover and attach validation to forms. Set to -1 to enable unlimited scanning time. -1 for infinite
form	form_discovery_interval	Number	500	Defines the time interval (in milliseconds) between consecutive scans of the page for form discovery and attachment.
form	form_elements	Array	null	Allows manual specification of one or more form elements to which the validation widget should be attached. This is especially useful for non-standard forms, such as those constructed with <div> containers instead of <form> tags. Additionally, this option supports applying different validation settings to multiple forms on the same page by associating each form element with its own configuration.
form	inspect	Boolean	false	options to allow visual highlighting of input fields that have validation rules attached
form	mode	String	ajax	Defines the validation trigger mode. By default, validation is performed when an input field loses focus (onBlur). Setting this to formSubmit will defer validation until the form's submit button is clicked, at which point all eligible fields will be validated. ajax formSubmit
form	on_ready	Function	null	Defines a callback function to be executed once the widget has fully loaded and is ready on the page. Use this to perform any initialization or custom logic after the widget becomes available. function() {}
form	prefill_validation	Boolean	false	Determines whether validation should be performed on pre-filled form fields when the widget initializes. When enabled, existing input values are validated immediately upon page load.
form	submit_button_cursor_style	String	pointer	Specifies the CSS cursor style to apply to the submit button. If not provided, the widget will inherit the cursor style defined by the form's existing styles.
form	submit_button_selector	jQuery selector	null	Specifies a jQuery selector for the form’s submit button. This is useful in cases where the widget cannot automatically identify the correct submit button.
form	suppress_form_builtin_error_message_selector	jQuery selector	null	option to supress form's built in error msg (used in hs)
form	timeout	Number	10	Specifies the maximum duration (in seconds) allowed for validation to complete. If validation exceeds this time limit, the entry will be permitted by default—unless the block_on_timeout setting is enabled. Max 180
form	trigger_form_discovery_on_event	String	null	event to listen to before loading the SDKSpecifies the name of an event to listen for before initiating form discovery on the page. Form scanning and validation attachment will start only after this event is triggered.
name	block_form_submission_on_limit_crossed	Boolean	false	Boolean to block form submission when your app’s email validation usage limit has been exceeded.
name	block_form_submission_on_timeout	Boolean	false	Boolean to block form submission if the email validation request times out
name	block_gibberish_name	Boolean	true	Boolean to allow or block names classified as gibberish by Clearout.
name	elements	Array	null	Allows you to specify an array of name validation configurations, each with a corresponding jQuery selector. This is especially useful when multiple name fields on a form require different validation rules. Each item in the array defines the selector for the input field and the specific validation settings to apply.
name	enabled	Boolean	false	Boolean to enable or disable name validation for the form
name	feedback	Boolean	true
name	feedback_gibberish_message	HTML String	invalid - gibberish name not allowed	Option to provide a custom HTML string displayed when an gibberish name is detected.
name	feedback_invalid_classname	HTML String	co-name-error-msg	Option to add a custom CSS class to Clearout’s feedback HTML container for styling purposes.
name	feedback_invalid_message	HTML String	invalid name	Option to provide a custom HTML string displayed when an invalid name is detected.
name	feedback_on_timeout_message	HTML String	name could not be verified - timeout occurred	Option to provide a custom HTML string to be displayed when validation timeout occurs
name	feedback_on_usage_limit_crossed_message	HTML String	unable to verify the name, usage limit crossed	Option to provide a custom HTML string to be displayed when usage limit has crossed on your app
name	gibberish_threshold	String	high	Defines the strictness level for gibberish detection, allowing adjustment of how aggressively invalid or nonsensical names are filtered.
name	on_after_verify	Function	null	Callback function executed immediately after Clearout’s validation completes, useful for handling post-validation actions.
name	on_before_verify	Function	null	Callback function executed immediately before Clearout’s validation starts, useful for performing pre-validation logic.
name	optional	Boolean	false	Boolean indicating if the email field is optional; when true, empty values are accepted and skipped during validation.
name	selector	jQuery selector	null	Option to specify a jQuery selector to attach Clearout’s validation. Only needed if Clearout is unable to automatically detect the name field. This explicitly sets the target for validation when automatic detection fails.
phone	allowed_countries	Array	[]	Option to accept phone numbers from certain countries only.
phone	block_form_submission_on_limit_crossed	Boolean	false	Boolean to block form submission when your app’s email validation usage limit has been exceeded.
phone	block_form_submission_on_timeout	Boolean	false	Boolean to block form submission if the email validation request times out
phone	block_landline_numbers	Boolean	false	Boolean to block landline phone numbers from being submitted through the form.
phone	block_mobile_numbers	Boolean	false	Boolean to block landline mobilenumbers from being submitted through the form.
phone	block_toll_free_numbers	Boolean	false	Boolean to block toll-freephone numbers from being submitted through the form.
phone	block_unknown_type	Boolean	false	Boolean to block unknown phone numbers from being submitted through the form.
phone	block_voip_numbers	Boolean	false	Boolean to block voip phone numbers from being submitted through the form.
phone	elements	Array	null	Allows you to specify an array of phone validation configurations, each with a corresponding jQuery selector. This is especially useful when multiple phone fields on a form require different validation rules. Each item in the array defines the selector for the input field and the specific validation settings to apply.
phone	enabled	Boolean	false	Boolean to enable or disable phone validation for the form
phone	feedback	Boolean	true
phone	feedback_invalid_classname	String	co-phone-error-msg	Option to add a custom CSS class to Clearout’s feedback HTML container for styling purposes.
phone	feedback_invalid_message	HTML String	invalid phone number	Option to provide a custom HTML string displayed when an invalid phone is detected.
phone	feedback_landline_message	HTML String	invalid - landline numbers not allowed	Option to provide a custom HTML string displayed when a landline phone is detected.
phone	feedback_mobile_message	HTML String	invalid - mobile numbers not allowed	Option to provide a custom HTML string displayed when an mobile phone is entered
phone	feedback_on_timeout_message	HTML String	phone number could not be verified - timeout occurred	Option to provide a custom HTML string to be displayed when validation timeout occurs
phone	feedback_on_usage_limit_crossed_message	HTML String	unable to verify the phone number, usage limit crossed	Option to provide a custom HTML string to be displayed when usage limit has crossed on your app
phone	feedback_toll_free_message	HTML String	invalid - toll free numbers not allowed	Option to provide a custom HTML string displayed when an toll-free phone is detected.
phone	feedback_unknown_message	HTML String	invalid - unknown numbers not allowed	Option to provide a custom HTML string displayed when phone number's status could not be determined
phone	feedback_voip_message	HTML String	invalid - voip numbers not allowed	Option to provide a custom HTML string displayed when an voip phone is detected.
phone	on_after_verify	Function	null	Callback function executed immediately after Clearout’s validation completes, useful for handling post-validation actions.
phone	on_before_verify	Function	null	Callback function executed immediately before Clearout’s validation starts, useful for performing pre-validation logic.
phone	optional	Boolean	false	Boolean indicating if the email field is optional; when true, empty values are accepted and skipped during validation.
phone	overlay	Boolean	false	Experimental: Option to enable Clearout’s enriched phone overlay on existing phone input fields with a country code dropdown. Enhances the user experience with formatting and validation support.
phone	prefill_dial_code	Boolean	false	Option to automatically add dial code (eg: +1) to phone number based on page visitor's location.
phone	selector	jQuery selector	null	Option to specify a jQuery selector to attach Clearout’s validation. Only needed if Clearout is unable to automatically detect the phone field. This explicitly sets the target for validation when automatic detection fails.

Customizing Styles and CSS

All UI components created by the Clearout Form Guard come with properly namespaced CSS classes, making it easy to target and customize their appearance using your own styles.

Below is a list of all elements and their associated class names:

• co-input-container: This is the main wrapper div, which is wrapped around the respective input container.

• co-loader-container: This is the loader container, which is placed on top of the container.

• co-loader-img-container: This is the loader image's container, which basically contains the tick, cross, or the loader.

• co-feedback-container: This is the container that contains the feedback elements and is positioned just below the input container.

• co-feedback-msg: This is the container containing the actual feedback message.

Using the Validators

All of Clearout's built-in validators are exposed under the global window.clearout object. This allows advanced users to directly access and invoke the verify method of each validator, enabling deeper integration or custom validation logic in your application.

For example, you can manually trigger a validation like this:

let emailValidationResponse = await window.clearout.emailValidator.verify({ email: '[email protected]' })
console.log('Email Validation Response: ', emailValidationResponse.result)

let phoneValidationResponse = await window.clearout.phoneValidator.verify({ phone: '[phone]' })
console.log('Phone Validation Response: ', phoneValidationResponse.result)

let nameValidationResponse = await window.clearout.nameValidator.verify({ name: 'Nishanth Babu' })
console.log('Name Validation Response: ', nameValidationResponse.result)

Using these exposed validation methods, you can verify the data in runtime alongside your client side logics to determine the status of data points at any point in your workflows.

Using the Form Component

To manually attach the Clearout Form Guard to specific forms using the SDK, you can use the globally available FormValidator class. This allows you to create an instance of the widget directly on a jQuery form object, offering precise control over which forms are initialized and how.

You can do this by instantiating FormValidator with two parameters: the jQuery form object and a custom options object. These options can either be inherited from the globally available window.clearout.options or fully customized as per your requirements.

new window.clearout.FormValidator(clearout.$('#testform'), clearout.options)

Form Guard Callback Hooks

The Clearout Form Guard currently supports three types of callback hooks that allow you to extend and customize the validation process:

• on_ready Triggered when the Clearout JS SDK is fully loaded and initialized on the page.

• on_before_verify Triggered just before the input data is sent to Clearout for validation.

• on_after_verify Triggered immediately after Clearout returns the validation response.

Note: The on_before_verify and on_after_verify hooks are field-specific and are individually available for email, phone, and name validations. This allows you to apply fine-grained logic tailored to each input type.

on_ready hook

The on_ready hook is executed once the Clearout Form Guard SDK has fully loaded and initialized on the page. This hook is particularly useful for running initialization logic that needs to execute once the Form Guard is ready.

Common use cases include:

• Applying custom CSS or styling to Form Guard elements

• Adding specific data attributes to input fields

• Running setup scripts that depend on the Form Guard being initialized

This callback guarantees that all globally scoped variables—such as validators and configuration options—are accessible and fully initialized, ensuring a safe point to begin custom interactions with the widget.

on_before_verify hook

The on_before_verify hook is triggered just before the field data is sent to Clearout for validation. This hook is ideal for performing custom pre-validation checks on the input data.

Function Parameters

The callback receives a destructured object:

• email, phone, or name: The actual value being entered in the field

• $form: The jQuery-wrapped form element

The Function is expected to return an object with is_acceptable (true/false) and an error_msg string. If is_acceptable is set to false, the field will not be submitted, and the provided error_msg will be displayed to the user.

This gives you complete control to add pre-checks or filters before Clearout runs its own verification logic.

function ({ email, $form }) {
  let is_acceptable = true
  let error_msg = null
  console.log('Debug: OnBeforeVerify hook is called: ', { email, $form })

  // Your Logic goes here
  // a simple account length check
  let acctName = email.split('@')[0]
  if (acctName.length > 25) {
    is_acceptable = false
    error_msg = 'Email is too long! pls try a shorter email.'
  }
  return ({ is_acceptable, error_msg })
}

on_after_verify hook

The on_after_verify hook is triggered after Clearout returns a response for the field's validation. This hook is particularly useful for performing any post-verification checks, triggering workflows, or making UI changes based on the validation outcome.

Function Parameters

The callback receives a destructured object:

• email, phone, or name: The actual value being entered in the field

• $form: The jQuery-wrapped form element

• result: The verification response

The Function is expected to return an object with is_acceptable (true/false) and an error_msg string. If is_acceptable is set to false, the field will not be submitted, and the provided error_msg will be displayed to the user.

This gives you complete control to add post-checks or filters after Clearout runs its own verification logic.

function ({ phone, $form, result }) {
  let is_acceptable = true
  let error_msg = null
  console.log('Debug: OnBeforeVerify hook is called: ', { phone, $form, result })

  // Your Logic goes here
  // A Sample logic to determine the length of phone number
  if (phone.length !== 10) {
    error_msg = 'Invalid Phone number not allowed!'
    is_acceptable = false
  }
  return ({ is_acceptable, error_msg })
}