Implementing Convertr's live email and telephone validation via javascript tags.

Telephone Lookup

You'll need to embed the following script tag into the bottom of your page, below the closing `</body>` tag.

Telephone Example

<script src="https://{your_domain}.cvtr.io/public/telephone-lookup.js?c={campaign_id}&f={form_id}&tel_id={telephone_field_id}&cc_id={telephone_country_code}" type="text/javascript" charset="utf-8" async></script>

Required Parameters

Field	Example	Description
c	44001	The ID of the Convertr campaign to track this activity to
f	1	The form related to the above Campaign ID to associate this usage to
tel_id	telephone	The HTML input id attribute to listen for change events, we'll use the value of this field as the telephone number when the user changes focus
cc_id	country_code	The HTML input id attribute for the country code, we'll use the value of this field as the associated country code number when the user changes focus from the telephone field

Responses

After we've performed our lookup, we'll append the result of the lookup in a new `<div>`, directly after the `tel_id` field with the following classes:

Class	Scenario
.cvtr-telephone-feedback	All feedback `<div>`s from Convertr's telephone lookup will have this class
.cvtr-telephone-valid	If the result is positive then this class will be added to the above .cvtr-telephone-feedback class
.cvtr-telephone-error	If the result is negative then this class will be added to the above .cvtr-telephone-feedback class

Email Lookup

You'll need to embed the following script tag into the bottom of your page, below the closing `</body>` tag.

Telephone Example

<script src="https://{your_domain}.cvtr.io/public/email-lookup.js?c={campaign_id}&f={form_id}&email_id={email_field_id}" type="text/javascript" charset="utf-8" async></script>

Required Parameters

Field	Example	Description
c	44001	The ID of the Convertr campaign to track this activity to
f	1	The form related to the above Campaign ID to associate this usage to
email_id	email	The HTML input id attribute to listen for change events, we'll use the value of this field as the email address when the user changes focus

Responses

After we've performed our lookup, we'll append the result of the lookup in a new `<div>`, directly after the `email_id` field with the following classes:

Class	Scenario
.cvtr-email-feedback	All feedback `<div>`s from Convertr's email lookup will have this class
.cvtr-email-valid	If the result is positive then this class will be added to the above .cvtr-email-feedback class
.cvtr-email-error	If the result is negative then this class will be added to the above .cvtr-email-feedback class

Example:

The following example will work out the box, providing you update the domain, campaign and form values to your own enterprise values.

It's recommended that you implement your own logic to prevent form submission until both lookups have their respective valid classes on the feedback elements.

Example

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<title>Convertr Live Lookup Demo</title>
		<link rel="stylesheet" href="">
	</head>
	<body>
		<form>
			<div class="form-group">
				<label for="email">Email</label>
				<input id="email" name="email" type="email" placeholder="Email Address">
			</div>
			<div class="form-group">
				<label for="tel">Telephone Number</label>
				<input id="tel" name="text" type="text" placeholder="Telephone">
			</div>
			<input type="hidden" id="country_code" name="country_code" value="+44">
			<button type="submit" name="go">Submit</button>
		</form>
		<script src="https://{your_domain}.cvtr.io/public/email-lookup.js?c=44001&f=1&email_id=email" type="text/javascript" charset="utf-8" async></script>
		<script src="https://{your_domain}.cvtr.io/public/telephone-lookup.js?c=44001&f=1&tel_id=tel&cc_id=country_code" type="text/javascript" charset="utf-8" async></script>
	</body>
</html>

Browser not supported