Click here to Skip to main content
15,890,973 members
Articles / Web Development / ASP.NET
Tip/Trick

Email Validation in JavaScript

Rate me:
Please Sign up or sign in to vote.
3.71/5 (17 votes)
12 Nov 2012CPOL 622.1K   9   17
While developing a web page in fully HTML controls, you may not be able to use ASP.NET's controls, then you may need the help of some JavaScript function for validation.

What's it all about

While developing a web page in fully HTML controls, you may not be able to use the ASP.NET's controls for example if you want some validation then you can not use the regular expression control there. So there you may need this technique for validating your HTML controls.

Using the code  

Here I will show you how to validate the HTML controls using JavaScript.

Take a text input in html and a button input like this 

XML
<input type='text' id='txtEmail'/>
<input type='submit' name='submit' onclick='Javascript:checkEmail();'/>

Now when the button is clicked then the JavaScript function SubmitFunction() will be called. Now write the bellow code in this function.

JavaScript
script language="javascript">

function checkEmail() {

    var email = document.getElementById('txtEmail');
    var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;

    if (!filter.test(email.value)) {
    alert('Please provide a valid email address');
    email.focus;
    return false;
 }
}</script>

Now you have successfully validate your HTML controls through JavaScript.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



Comments and Discussions

 
GeneralMy vote of 5 Pin
Emran Radfar1-Sep-21 21:22
Emran Radfar1-Sep-21 21:22 
QuestionEmail Validation in JavaScript Pin
azeem ali22-Jun-20 0:06
azeem ali22-Jun-20 0:06 
AnswerEmail Validation in JavaScript Pin
azeem ali22-Jun-20 0:00
azeem ali22-Jun-20 0:00 
Suggestionverification emails Pin
Member 1384077623-May-18 2:54
Member 1384077623-May-18 2:54 
While it's fine to check the format of an email address client-side using a regex, the only way to really, totally, be sure that an email address exists is to confirm that you can send email to it, and that somebody can receive it. Unfortunately, it's not possible to send an email directly from the browser without outside help. That outside help can take the form of some server-side coding on your application, or a third party service that you can use directly from the browser.

There are a few such services, but clicktoverify.net provides a pretty painless integration for most simple forms, which should be just a few lines of code:
<form method="POST" action="whatever" id="my-form">
    <input type="email" name="email" />
    <input type="submit" name="sign up!" />
</form>
<script type="text/javascript" src="https://cdn.clicktoverify.net/ctv.js"></script>
<script type="text/javascript">
form = document.getElementById("my-form");
form.addEventListener('submit', function(event) {
    event.preventDefault();

    alert("We've sent a verification email to this address. Please check your inbox.");
    verifier = new CTV();
    verifier.verify({
         email: form['email'].value,
         public_api_key: "71917c69-b8e8-3992-adf5-c2de3b89c17e", //you'll get your own when you create an account
         success: function(xhr) {
          alert("Your email address is verified!");
          form.submit();
         },
         error: function(xhr) {
          alert("Something went wrong! We couldn't verify your email address.");
         }
    });
});
</script>

QuestionClarification of code Pin
Member 131032743-Apr-17 7:25
Member 131032743-Apr-17 7:25 
QuestionEmail validation using javascript without using an array Pin
Member 1215533120-Nov-15 2:02
Member 1215533120-Nov-15 2:02 
AnswerMessage Closed Pin
22-Jun-20 0:09
azeem ali22-Jun-20 0:09 
GeneralMy vote of 5 Pin
Member 1022527225-Jan-14 0:51
Member 1022527225-Jan-14 0:51 
Questionvalidation Pin
Pascualito2-Nov-13 10:52
professionalPascualito2-Nov-13 10:52 
AnswerRe: validation Pin
alpesh_11_3_19892-Jun-15 2:02
alpesh_11_3_19892-Jun-15 2:02 
GeneralRe: validation Pin
Pascualito3-Jun-15 3:34
professionalPascualito3-Jun-15 3:34 
GeneralMy vote of 2 Pin
Jerry OLoughlin9-Sep-13 7:29
Jerry OLoughlin9-Sep-13 7:29 
GeneralRe: My vote of 2 Pin
alpesh_11_3_19892-Jun-15 1:58
alpesh_11_3_19892-Jun-15 1:58 
SuggestionIssue Pin
vikastin6-Feb-13 19:43
vikastin6-Feb-13 19:43 
GeneralRe: Issue Pin
alpesh_11_3_19892-Jun-15 1:56
alpesh_11_3_19892-Jun-15 1:56 
GeneralMy vote of 2 Pin
Selvin19-Nov-12 13:00
Selvin19-Nov-12 13:00 
GeneralRe: My vote of 2 Pin
alpesh_11_3_19892-Jun-15 1:29
alpesh_11_3_19892-Jun-15 1:29 
GeneralNice one Pin
Kill the BUG14-Nov-12 22:24
Kill the BUG14-Nov-12 22:24 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.