I've got a simple login form with the absolute basics in place for front-end validation. It just checks that the fields aren't blank and that the email is in the most basic correct format. When the form is invalid I prevent the submit behavior.
When I enter something into both fields so they aren't blank, but the email is still invalid, the form is not submitted, yet I am still prompted by browsers to save my credentials.
How can I prevent this from happening when the form is invalid and hasn't yet been submitted? I still want this feature to be offered to users, but only when the form is actually submitted.
Here's the basics of how I've set this up:
HTML:
<form method="post" action="" onsubmit="return validateForm()" novalidate>
<input type="text" id="email" required autofocus>
<input type="password" id="password" required>
</form>
JS:
function validateForm() {
var isValid = true;
//validation logic goes here...
return isValid;
}
Here's a working demo: https://codepen.io/chrismbarr/pen/awmVyq Enter an invalid email and something in the password field to trigger this.
