Question

I want to validate this email :

<div>
    <div>

        <div  >
            <big><p>please enter an email address IF you wish to
            recieve a link to your results.<p>
            E-mail Address:</big> <input name="recipient"class="upload" type="text"
            />
        <div id="correct">
            &#10004;
        </div>
        <div id="incorrect">
            &#10008;
        </div>
    </div>
</div>

I want to check if the email input is valid, if its is valid show the “correct” div , if not show the “incorrect” div, i want to do this without submitting the form.

cant anyone help ? thanks

Answer 1

Here is a function which uses Regex to match value.

<script language="javascript">
    function checkEmail() {
    var email = document.getElementById('recipient');
    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;
    document.getElementById('incorrect').style.visibility="visible";
    document.getElementById('correct').style.visibility="hidden";
    }
    else
    {
    document.getElementById('correct').style.visibility="visible";
    document.getElementById('incorrect').style.visibility="hidden";
    }
    }
    </script>