check for valid email using javascript

Question

I am able to check for empty field but how do I also check for the valid email checking regular expression? here is what I have so far

<script>
function validateForm()
{
var x=document.forms["myForm"]["fname"].value;
if (x==null || x=="")
  {
  alert("First name must be filled out");
  return false;
  }
var y=document.forms["myForm"]["email"].value;
if (y==null || y=="")
  {
  alert("email must be filled out");
  return false;
  }
}
</script>
</head>

<body>
<form name="myForm" action="demo_form.asp" onsubmit="return validateForm()" method="post">
First name: <input type="text" name="fname"><br>
email: <input type="text" name="email">

<br><br>
<input type="submit" value="Submit">
</form>

1) Use jQuery validate - it's built in. 2) Use Google, this is a very common question. — Rory McCrossan, Feb 05 '13 at 20:10

score 1 · Accepted Answer · edited May 23 '17 at 11:56

1

The fist thing you could do is use the HTML5 type="email" attribute., the browser will validate natively. But you must always have a fall-back.

Use (found here)

/^[a-zA-Z0-9.!#$%&’*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/

as regualar expression: and do

var validEmailStyle = /^[a-zA-Z0-9.!#$%&’*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/
if(!validEmailStyle.test(document.forms["myForm"]["email"].value))
{
  // the user is dumb and fill in an invalid email, show a help text
  // or something like that
}

- edit after valid comment of PeeHaa

You must not forget to also validate server side, if you are using PHP you can use preg_match with the same regexp

edited May 23 '17 at 11:56

Community

1
1

answered Feb 05 '13 at 20:16

beardhatcode

4,533
1
16
29

2

You forgot the most important point: **always also validate on the serverside!!!** :) – PeeHaa Feb 05 '13 at 20:22
@peehaa- it worked...yes...that is something i am working on right now – soum Feb 05 '13 at 20:34

Kolby · Answer 2 · 2013-02-05T20:31:08.843

-1

var pattern = /^\b[A-Z0-9._%-]+@[A-Z0-9.-]+\.[A-Z]{2,4}\b$/i

if(!pattern.test(userinput))
{
  alert('not a valid e-mail address');
}

Just showing an example, you can find a better regex pattern.

edited Feb 05 '13 at 20:31

answered Feb 05 '13 at 20:11

Kolby

2,775
3
25
44

Why are people hating my mailaddresses? :( – PeeHaa Feb 05 '13 at 20:13
The `+` symbol is valid in the alias part of an address. Also, domains with more than two dot-separated names will be regarded as invalid by this regex, so this would reject my `me@domain.me.uk` address. Even '.com' domains often have more than two parts. – halfer Feb 05 '13 at 20:29
Also there is a lot more when it comes to valid emailaddresses. For an example of a decent regex see PHP's regex to validate them: http://stackoverflow.com/questions/12026842/how-to-validate-an-email-address-in-php/12026863#12026863 – PeeHaa Feb 06 '13 at 08:46

check for valid email using javascript

2 Answers2