Question

How to set a custom HTML form validation message in JavaScript

Answer 1

<form>
    <input type="email" placeholder="Email" id="emailID" required />
    <input type="submit" id="submitID"/>
</form>

const email = document.querySelector('#emailID');
const submit = document.querySelector('#submitID');

submit.addEventListener('click',()=>{
    if (email.validity.typeMismatch){
        email.setCustomValidity('Please enter a valid email address');
    } else {
        email.setCustomValidity('');
    }
})

  
    
    
/*
run:
    
Please enter a valid email address
    
*/

 

70+ SQL courses for beginners and professionals