Problem Statement:
We are implementing our custom classic login page. How can we validate the email on the hosted page?
Solution:
Auth0 validates email format on the server side however it may be better to implement the same email validation on the front end to avoid unnecessary API calls. Auth0’s Lock.js login widget uses a third-party library named https://www.npmjs.com/package/validator for email validation.
The same library can be used with the fully custom login widget. Here is a simplified sample code using this library:
<script type="text/javascript" src="validator.min.js"></script>
<script type="text/javascript">
if (validator.isEmail('foo@bar.com')) {
webAuth.redirect.signupAndLogin ();
} else {
alert("Email validation failed");
}; //=> true
</script>
This Gist shows how the library could be used along with our default custom classic login page:
