Source Code: (back to article)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Form Validation Example</title>
</head>
<body>
<form name="registrationForm">
<input type="email" name="email" placeholder="Enter your email" required>
<input type="submit" value="Register">
</form>
<div id="message"></div>

<script>
var form = document.forms['registrationForm'];
var email = form.elements['email'];

form.onsubmit = function() {
// Note: HTML5 email validation considers 'mehdi@gmail' as a valid email,
// which is a common bug where it misses the full domain specification.
if (!email.checkValidity()) {
document.getElementById('message').textContent = "Please enter a valid email address.";
return false;
}
document.getElementById('message').textContent = "Registration successful!";
return false; // Prevents actual form submission
}
</script>
</body>
</html>