I tried to create a function for Validate Email in three cases:

1. check the email text field whether it contains ‘@’ for any email address.
2. make sure that the email field is not empty 3)it does not contain more than 100 characters.

my problem is that when I press submit, it just checks for ‘@’ even when the field is empty output

this is my code from Apache NetBean:

for form:

<form method="post" action ="" novalidate onsubmit="return ValidateRadioButtons(), ValidateEmail()">

for email:

            <input type = "text" name ="email" id = "email" placeholder="[email protected]" onchange="ValidateEmail()" >

for function:

    function ValidateEmail() {
        var email = document.getElementById("email");
        if (email.value.length > 100) {
            window.alert("Email address should not contain more 100 than characters");
            email.focus();
            return false;
        } else if (email.value.indexOf("@") < 0) {
            window.alert("Email address should  contain @ character");
            email.focus();
            return false;
        } else if (email.value.length === 0) {
            window.alert("You should enter Email address");
            email.focus();
            return false;
        } else {
            return true;
        }
    }

CodePudding user response：

You need to check if the length is 0 first, then the maximum length. Then you can check the required @ if the previous checks are ok!

function ValidateEmail() {
    var email = document.getElementById("email");
    if (email.value.length ===0 ) {
        window.alert("You should enter Email address");
        email.focus();
        return false;
    } else if (email.value.length > 100) {
        window.alert("Email address should not contain more 100 than characters");
        email.focus();
        return false;
    } else if (email.value.indexOf("@") < 0) {
        window.alert("Email address should  contain @ character");
        email.focus();
        return false;
    } else {
        return true;
    }
}