Javascript regex email validation

Question

I have used regex to test for the email input. It does give an alert when a wrong email (for eg without an @ or .com) is submitted but when I press ok for the alert, it still posts the email to the email address that is am directed to the page send_msg.php when it should not.. I am quite new to Javascript and PHP so I am still learning.. I know that the if clause should follow an else but I don't know how to make it post the email if it is true. And can how I make it just display a message below the email input field instead of making it raise an alert?

<script>
function checkEmail(inputvalue){    
var pattern=/^([a-zA-Z0-9_.-])+@([a-zA-Z0-9_.-])+\.([a-zA-Z])+([a-zA-Z])+/;
if(pattern.test!=(inputvalue)){  
         alert("Please enter a valid email address");  
         return false;


}

}

<form id="contact-form" name= "form1 "action="send_msg.php" method="post">
        <h3>Get in touch</h3>
        <h4>Fill in the form below, and we'll get back to you within 24 hours.</h4>
        <div>
            <label>
                <span>Name: </span>
                <input placeholder="Please enter your name" name="name" type="text" tabindex="1" required autofocus>
            </label>
        </div>
        <div>
            <label>
                <span>Email: </span>
                <input placeholder="Please enter your email address" name="email" type="email" tabindex="2" required>
            </label>
        </div>

        <div>
            <label>
                <span >Message: </span>
                <textarea placeholder="Include all the details you can" name="message" tabindex="5" size= "35" maxlength= "255"></textarea>
            </label>
        </div>
        <div>
            <button name="submit" type="submit" onClick="checkEmail(document.contact-form.email.value)" id="contact-submit">Send Email</button>
        </div>
    </form>

For completeness, [RFC 5322](https://tools.ietf.org/html/rfc5322#section-3.4.1) allows the use off `+` in email addresses e.g `foo+bar@example.com`, your current regex would fail that email. — Sean, Apr 26 '15 at 11:05

score 0 · Answer 1 · edited Oct 24 '20 at 16:44

0

Assuming that the regex validation is ok, you can prevent the form to submit, simply by doing this:

<form onsubmit="return checkEmail(document.contact-form.email.value);" id="contact-form" name= "form1 "action="send_msg.php" method="post">
...
</form>

And remove the onClick from the submit button. If the regex function returns true if valid and false if not valid, than the form will submit only when the email input has valid data in it.

edited Oct 24 '20 at 16:44

halfer

19,824
17
99
186

answered Apr 26 '15 at 10:58

Andrei CACIO

2,101
15
28

I have tried it but it is still not working.. It still sends the email.. I think the problem lies in the regex validation: `` – Tia Apr 26 '15 at 11:19
try this answer http://stackoverflow.com/questions/46155/validate-email-address-in-javascript – Andrei CACIO Apr 26 '15 at 16:00

score 0 · Answer 2 · answered Apr 26 '15 at 10:59

0

seems like your function has syntax error use it this way

function checkEmail(inputvalue){    
var pattern=/^([a-zA-Z0-9_.-])+@([a-zA-Z0-9_.-])+\.([a-zA-Z])+([a-zA-Z])+/;
         return pattern.test(inputvalue); 
}
checkEmail('rte@co') // false
checkEmail('rte@co.com') // true

answered Apr 26 '15 at 10:59

talsibony

8,448
6
47
46

Also.. you can simplify the regex to `/^([\w.-])+@([\w.-])+\.([a-zA-Z])+/` – karthik manchala Apr 26 '15 at 11:02

Javascript regex email validation

2 Answers2