Simple form Validation for “All Emails”

Here is a simple way to validate all email inputs on a page a valid format.  You’ll want to check this with your Form’s On submit

<script>
        var OverRide = false;

        function setOverRide(){
            OverRide = true;
        }

        function isValidEmail(Value){
            var emailPattern = /^(([^<>()[\]\\.,;:\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     emailPattern.test(Value);
        }

        function CheckEmails(){

            if (OverRide)
                return true;

            returnVal = true;
            $('.requiresEmail').each(    function () {
                if (!isValidEmail($(this).val())){
                    $(this).css('background-color', '#f1c7c4');
                    returnVal = false;
                } else
                    $(this).css('background-color', '#fff');
            });

            return returnVal;    
        }

    </script>

You’ll need to set your email inputs with the class requiresEmail

<input type="text" class="requiredEmail" name="email" id="email">

And check your form this way:

<form name="checkoutInformation" action="/destination" method="post" onsubmit="return CheckEmails();">

Leave a Reply

Your email address will not be published. Required fields are marked *