My Goal

I want to validate an email field in Unbounce so that:

1. Users are prompted to enter a work email address (e.g., no Gmail, Yahoo, etc.).
2. An error message appears on the first invalid submission.
3. Users can proceed with any email after being prompted once.

What I’ve Tried

1. Custom Validation Field Only:
   • I added regex in the Custom Validation field to block specific domains.
   • This successfully validated emails but prevented users from proceeding after being prompted once because the regex strictly enforced validation.
2. JavaScript Only:
   • I left the Custom Validation field empty and relied entirely on JavaScript.
   • I added logic to dynamically validate emails, show an error message, and allow submission after the first invalid attempt.
   • However, the form still submitted on the first invalid attempt, even with event.preventDefault().
3. Combination of Both:
   • I used the Custom Validation field for regex validation and JavaScript for dynamic behavior.
   • This caused conflicts, with the custom validation overriding JavaScript, preventing dynamic "prompt once" behavior.

Current Issues

1. The form continues to submit on the first invalid attempt when relying solely on JavaScript.
2. Using both the Custom Validation field and JavaScript together seems to cause the JS to be ignored.
3. The error message sometimes appears briefly but does not prevent form submission.

Any help on this would be greatly appreciated - thanks!