Need help checking if a value exist using JQuery .inArray()

Question

I would like to display an error message when a user types a value in an input field (emailaddressVal) that matches a value in my array (invalidEmailAddresses). But I don't know how to go about it. Thanks for your help!

$(document).ready(function(){
    $("input[name='emailAddress']").blur(function(){
        // Actual Email Validation function

            var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
            var hasError = false;
            var emailaddressVal = $("input[name='emailAddress']").val();
            var invalidEmailAddresses = 
            ['aol.com', 'yahoo.com', 'yahoo.fr', 'juno.com', 'hotmail.com', 'gmail.com'];     

            if($.inArray(invalidEmailAddresses,emailaddressVal) == -1) {
            alert('The email provided is not from a business related domain');                 

            }


    });


});

Answer 1

Try the following code

    $(document).ready(function () {
    $("input[name='emailAddress']").blur(function () {

        var emailAddress = $("input[name='emailAddress']").val().trim();

        if (isValidEmailAddres(emailAddress)) {
            var hasError = false;
            var emailaddressVal = emailAddress.split('@').slice(1)[0].trim();

            var invalidEmailAddresses = ['aol.com', 'yahoo.com', 'yahoo.fr', 'juno.com', 'hotmail.com', 'gmail.com'];

            if ($.inArray(emailaddressVal, invalidEmailAddresses) >=0) {
                alert('The email provided is not from a business related domain');

            }
        } else alert("Invalid EmailID");
    });

    function isValidEmailAddres(emailID) {
        var regexExp = new RegExp(/^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i);
        return regexExp.test(emailID);
    }

});

See this fiddle Changes That I did

I added a email Validation Function. Only if it is a valid email address you will proceed for hostname checking.

Correct Format of $.inArray is $.inArray( stringvalue, array) . So it has to be $.inArray(emailaddressVal,invalidEmailAddresses)

emailaddressVal will contain a full email address. First you need to extract the hostname from that full email address. It is done at var emailaddressVal = emailAddress.split('@').slice(1)[0].trim(); So if your email address is abc@gmail.com , the above line will return gmail.com .

Return type of $inArray is the position at which the passed string (emailaddressVal in your case) is present in the arraylist (invalidEmailAddresses). It will return a value greater than or equal to 0. As per your requirement you have to show the message when you want the host in email id is present in array of host names. You need to do if($.inArray(emailaddressVal, invalidEmailAddresses) >=0)

Answer 2

You can use the jQuery inArray test like this.

var emailaddressVal = $("input[name='emailAddress']").val();

The code beloe test the user input to see if it is in the array and stores the index in which it is located.

var inArrTest = $.inArray(emailaddressVal, invalidEmailAddresses);

This code test the inArrTest variable and gets the index of the users matched value.

if (inArrTest) {
    // Your error message would go here. //
    console.log(invalidEmailAddresses[inArrTest]);
}

You can nest your error message inside the if block.

Answer 3

The original code does not work because the -1 checks to see if the variable is not in the array.

$.inArray(invalidEmailAddresses,emailaddressVal) == -1)

Sukanya's code check to see if the variable is greater than 0 which is the first index of an array.

 $.inArray(emailaddressVal,invalidEmailAddresses) > 0