How to validate the email field through JavaScript ? Or How to set validation to your email box through JavaScript?

Description:- In this example I’m gonna show you the code which use for email validation through JavaScript. You can use this email box with validation for your forget password area.

<!DOCTYPE html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Forget password</title>
<link rel="stylesheet" href="bootstrap.min.css" type="text/css"/>
<script src="bootstrap.min.js" type="text/javascript"></script>
<script src="jquery-1.11.1.min.js" type="text/javascript"></script>
function valid(forget_form,email)
    var expression = /^([a-zA-Z0-9_\-\.]){1,}\@([a-zA-Z_\-\.]){1,}\.([a-zA-Z]{2,4})$/;
    var address=document.forms[forget_form].elements[email].value;
    var eee=document.getElementById("email").value;
        alert("Please fill the field");
        return false;
        document.getElementById("err").innerHTML="Invalid email format. Please Insert the valid one";
        return false;

<div class="container" style="margin-top:200px">
    <div class="row">
        <div class="col-md-4"> </div>
        <div class="col-md-4">
            <form action="profile.html" method="post" role="form" id="forget_form" onSubmit="return valid('forget_form','emaill');" >
                <div class="form-group">
                    <label for="email">Email:</label>
                    <input type="text" name="emaill" id="email" class="form-control"/>
                    <span id="err"></span>
                    <input type="submit" class="btn btn-info" value="Submit" style="margin-top:5px"/>
        <div class="col-md-4"> </div>

*Note:- After writing all the aforesaid codes make one more page and name it as profile.html (which is mentioned in the form action). And don’t forget to include 3 main Bootstrap files in this example because this example is totally Bootstrap.


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s