How to Filter Personal Email Domains in Webflow Forms

A work-email prompt can reduce personal addresses in a Webflow lead form. A browser-side domain filter cannot prove that a visitor represents a business.

It also cannot guarantee that personal addresses stay out of your CRM. Browser validation can be bypassed, so enforce any required acceptance rule in the receiving system before creating the CRM record.

Choose the rule you actually need

The example rejects four exact domains: gmail.com, yahoo.com, outlook.com and hotmail.com. It is a short list you control, not a complete directory of personal email providers.

Some legitimate customers use those services, while a custom domain says little about lead quality. Decide whether to block the address or simply ask for a company name before making the form harder to submit.

Configure the form and email field

Give the form element the ID business-contact. Use one email input inside it, set its type to Email and mark it required. Change the selector in the code if your form uses another ID.

Put the script in the page’s Before </body> custom-code field. It uses browser APIs and does not load a second copy of jQuery.

<script>
(function () {
  const form = document.getElementById("business-contact");
  if (!form) return;
  const email = form.querySelector('input[type="email"]');
  if (!email) return;
  const blocked = new Set([
    "gmail.com", "yahoo.com", "outlook.com", "hotmail.com"
  ]);
  function applyRule() {
    const value = email.value.trim().toLowerCase();
    const domain = value.slice(value.lastIndexOf("@") + 1);
    email.setCustomValidity(blocked.has(domain)
      ? "Please use your work email address." : "");
  }
  email.addEventListener("input", applyRule);
  email.addEventListener("change", applyRule);
  form.addEventListener("submit", function (event) {
    applyRule();
    if (!form.checkValidity()) {
      event.preventDefault();
      event.stopImmediatePropagation();
      form.reportValidity();
    }
  }, true);
  applyRule();
})();
</script>

Why the check listens to the form

The script compares the complete, lowercase domain after the @ sign. It does not impose a four-character limit on the final part of the address or reject a company domain merely because its name starts with gmail.

It updates a custom validity message as the field changes, clearing the message when the address passes. The form’s submit handler catches normal submission attempts, including the usual Enter-key route, rather than listening only to a button click.

Direct programmatic form.submit() calls bypass the submit event. A request can also reach an endpoint without using this page at all. This remains a convenience check for visitors, not a security boundary.

Test the route into your CRM

On a staging page, try a listed domain, a mixed-case address, a company address with a long domain suffix and an empty field. Submit by button and keyboard. Confirm that the error clears after an edit, accepted submissions reach the intended destination and other forms still work.

Then test the receiving service’s rule separately. Webflow notes that custom code can conflict with its own functionality, so verify the published form before relying on it. For campaign context alongside each accepted lead, see capturing UTM parameters in Webflow forms.