Email Input Validation

email-input-validation.js

// Validate email field for only business emails
document.addEventListener("DOMContentLoaded", function () {
  // UPDATE THIS - ID on the <form>
  let form = document.getElementById("pardot-form");
  // UPDATE THIS - ID on text element to display errors
  let errorElement = document.getElementById("email-domain-error");

  form.addEventListener("submit", function (event) {
    // UPDATE THIS - ID on the email <input>
    let emailInput = document.getElementById("email");
    let emailValue = emailInput.value.trim().toLowerCase();

    // Regular expression to validate email format
    let emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;

    if (!emailRegex.test(emailValue)) {
      errorElement.textContent = "Please enter a valid email";
      errorElement.style.display = "block";
      event.preventDefault(); // Prevent the form from submitting
    } else {
      // Check if the email contains any of the restricted domains
      let restrictedDomains = ["yahoo.com", "outlook.com", "hotmail.com", "gmail.com"];
      let isInvalidDomain = restrictedDomains.some(function (domain) {
        return emailValue.endsWith("@" + domain);
      });

      if (isInvalidDomain) {
        errorElement.textContent = "Please provide a business email address.";
        errorElement.style.display = "block";
        event.preventDefault(); // Prevent the form from submitting
      } else {
        // Clear the error message if the email is valid
        errorElement.textContent = "";
        errorElement.style.display = "none";
      }
    }
  });
});