HTML5 email input type accepts invalid mail id

Question

I have a form with a input filed with type email and a submit button. Context is that when the user clicks 'forgot password' from login page, this particular form will be displayed where user can enter their email id and get the link to reset password via mail.

Everything works fine except the input type email accepts abc@com where as i want the email id to be [email protected]. problem is that in case if user types abc@com instead of [email protected] by mistake they will not receive the reset password link and they wont be aware want went wrong.

I would like to get a solution for this problem.

you need to validate the email address - but note, that abc@com is considered a valid email according to the specification - it matches the regular expression ^[a-zA-Z0-9.!#$%&’*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$ — Jaromanda X
Just because you validate the email address doesn't mean they'll get it right. You're only covering one of the many possible errors they might make. :-/ — RobG

prasanth prasanth · Accepted Answer · 2016-11-29T05:57:45

use some regex like this Regex demo ./\b(\w+)(\@)(.*)(\.)(\w+)\b .Its check the . next place with @ in your string. \b it will set the word boundary ,match with particular one

var check = function(){
 var input =  document.getElementById('test').value;
 var checking = input.match(/\b(\w+)(\@)(.*)(\.)(\w+)\b/g);
  if(checking){
    console.log('accepted');
    }
  else{
    console.log('reject')
    }
  }

<input type="email" id="test"  value="abc@com">
<button onclick="check()">validate</button>

HTML5 email input type accepts invalid mail id

1 Answers