Javascript file does not validate email address

Question

I am trying to create a form where people can add their email addresses to sign up to a mailing list. I am struggling to validate whether they actually entered an e-mail address or not with JavaScript.

Here is the HTML form:

<script type="text/javascript" src="validate-email.js"></script>

<form id="updateform" action='send.php' onsubmit="return validateForm();" method='post'>
    <input type="email" name="emailaddress" placeholder="Your e-mail address"/>
    <input type="submit" name="submit" value="Submit">
</form>

And here is the JavaScript file's contents:

function validateForm()
{
var x=document.forms["updateform"]["emailaddress"].value;
var atpos=x.indexOf("@");
var dotpos=x.lastIndexOf(".");
if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length)
  {
  alert("Please enter a valid e-mail address to receive updates.");
  return false;
  }
}

What am I doing wrong? I am a complete beginner...

EDIT: Why is this down-voted? What did I do wrong? If you read my comments, this is a legitimate problem, and the solutions I searched on Stack Overflow do not meet my needs.

You can use regular expressions as given in [__Validate email address in JavaScript?__](http://stackoverflow.com/questions/46155/validate-email-address-in-javascript) — Satpal, Apr 27 '14 at 14:08
What is your code doing now? Also, not directly related to your question, but remember that validating in JavaScript only prevents honest mistakes, not malicious inputs. — kviiri, Apr 27 '14 at 14:10
also worth bearing in mind that `mad.h@tter@wonder.land.com` is a perfectly valid email address — andrew, Apr 27 '14 at 14:11
@Satpal I don't understand anything on that page you sent me. How do I use it? How do I tell a user that they must re-enter their email address? — etsnyman, Apr 27 '14 at 14:21
@kviiri I already have a working PHP script for preventing spam. — etsnyman, Apr 27 '14 at 14:21
Validating e-mail addresses through regular expressions is a [hopeless task](http://ex-parrot.com/~pdw/Mail-RFC822-Address.html). Just send confirmation emails to verify them. — Ingo Bürk, Apr 27 '14 at 14:41

score 0 · Answer 1 · edited May 23 '17 at 10:26

0

Use the regular expression to validate the email.

use this regex to validate

 var regex=  '/^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/';

Original Post is here

Edit!

function validateEmail(email) { 
    var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
    return re.test(email);
} 

function validateForm()
{
var email=document.forms["updateform"]["emailaddress"].value;
if (!validateEmail(email))
  {
  alert("Please enter a valid e-mail address to receive updates.");
  return false;
  }
}

edited May 23 '17 at 10:26

Community

1
1

answered Apr 27 '14 at 14:20

chandu

2,276
3
20
35

I don't know how to integrate this into my HTML code. – etsnyman Apr 27 '14 at 14:24
Just check the Update. If it would helpful to you give up arrow to answer – chandu Apr 27 '14 at 14:33
Hi @diproart I already mention original post link in my post. see one – chandu Apr 27 '14 at 14:40
I still have no idea how to include this in HTML code. What does my HTML need to look like in order to make use of this? How does this fit into my HTML code? Where in my HTML form does this need to be? – etsnyman Apr 27 '14 at 14:51
No need to change your html. Add validateEmail function at your script and change you validForm function like above – chandu Apr 27 '14 at 15:38

score 0 · Answer 2 · answered Apr 27 '14 at 14:20

1) use jQuery or similar framework and plugins. 2) use type="email" attribute for input tag.

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

Or validate custom:

 // validate function
 var isEmail = function(email){ 
        return /^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))$/.test(email); 
 }


function validateForm(){
  var email;

  // ... 
  // get value from html stuff
  // ...

  if(!isEmail(email)) 
    return alert('Email format fail! Please correct.')

  // do something next...
  // alert("That's it! Dude.");

}

It is a single-page site, really small. I see no need for a whole Javascript library, which is why I just want a few lines. — etsnyman, Apr 27 '14 at 14:25
ok. simple use /regexp/.test(email) to check. but remember email can contains non ASСII characters, like моя@почта.рф — diproart, Apr 27 '14 at 14:36
I still have no idea how to include it in my HTML so that the form in the HTML code uses the JavaScript. — etsnyman, Apr 27 '14 at 14:51

Javascript file does not validate email address

2 Answers2