How do I trigger the required alert for Input elements on lose focus

Question

My HTMl form has an email input with a required attribute:

<input type="email" name="email" id="email" required>

On form submit, an alert is displayed when the user does not enter the correct format.

Is there a way that when the input loses focus, the alert is still triggered when the user does not follow the correct format?

You may can trigger the form submission or implement your own validation method.. — Mosh Feu, May 12 '19 at 14:49
[This](https://stackoverflow.com/q/7548612/863110) may will help you. — Mosh Feu, May 12 '19 at 14:55

score 0 · Answer 1 · answered May 12 '19 at 15:11

On Vanilla JavaScript, I used the checkValidity() and validationMessage on the DOM. Here is the code:

email.addEventListener("blur", function(){
        if(!email.checkValidity()){
            document.getElementById("errEmail").innerHTML = email.validationMessage;
        }
})

How do I trigger the required alert for Input elements on lose focus

1 Answers1