Jquery check if input .val() contains certain characters

Question

I need to check if an input field on my page contains characters.

This is for very basic email address validation so I only want to check if the text is not empty, and contains @ and . characters.

I've been trying this way:

if (($("." + parentname.attr("class") + " #email").val().contains("@")) && ($("." + parentname.attr("class") + " #email").val().contains(".")))
{
    email = 1;
}

Assuming a value of me@this.com, this code will throw the following error:

Object me@this.com has no method 'contains'

So I did some research and found that .contains is for DOM objects, not strings with a suggestion to try this:

if (($("." + parentname.attr("class") + " #email").val().IndexOf("@") != -1) && ($("." + parentname.attr("class") + " #email").val().IndexOf(".") != -1))
{
    email = 1;
}

Which results in a similar error:

Object me@this.com has no method 'IndexOf'

I'm basically out of ideas here especially considering that the following code works as I want it to in another site I've made:

if ($("#contact-email").val().contains("yahoo.com")) {
    $(".errmsg").text("Domain yahoo.com has been banned due to excessive spam, please use another domain.");
}

Can anyone suggest any other things I could try or, better yet, how to do this properly?

It's `indexOf`, careful about the capitalization. – Aioros Feb 21 '13 at 09:52 — Aioros, Feb 21 '13 at 09:52

score 4 · Accepted Answer · answered Feb 21 '13 at 09:55

4

indexOf does not use a capital I at the start. Try this instead:

if (($("." + parentname.attr("class") + " #email").val().indexOf("@") != -1) && ($("." + parentname.attr("class") + " #email").val().indexOf(".") != -1))
{
  email = 1;
}

answered Feb 21 '13 at 09:55

toomanyredirects

1,972
15
23

I really hate it when I overlook such simple things... maybe it's because I'm in a hurry :/ Thanks very much! – Ortund Feb 21 '13 at 10:09
We all do it from time to time, no worries :) – toomanyredirects Feb 21 '13 at 10:11

score 3 · Answer 2 · answered Feb 21 '13 at 09:55

I have a function to validate emails in Javascript:

function isEmail(emailV){
    if(emailV != null && emailV != undefined){
        var pattern = 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 pattern.test(emailV);    
    }
    else{
        return false;
    }

}

It validate all the chars that emails allows, and you only have to call it like this:

if(isEmail($("#contact-email").val())){
   //EMAIL IS VALID
}
else{
   //EMAIL IS NOT VALID
}

score 0 · Answer 3 · answered Feb 21 '13 at 09:57

The method is indexOf instead of IndexOf. If you correct your code it should work like a charm :) .

Try this code snippet:

if (($("." + parentname.attr("class") + " #email").val().indexOf("@") !== -1) 
    && ($("." + parentname.attr("class") + " #email").val().indexOf(".") !== -1))
{
    email = 1;
}

score 0 · Answer 4 · answered Feb 21 '13 at 10:09

LIVE DEMO

// VISUALIZE ERRORS
function showError(el, err){
    return err ?  $(el).addClass('error') :  $(el).removeClass('error');
}

// REGEXES
var isValidEmailAddress = function( emailAddress ) {
    var pattern = 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 pattern.test(emailAddress);
};

// "EMAIL"
function validate_email( el, val ){
    var err = !isValidEmailAddress( val );
    showError(el, err);
}

$('#email').on('input', function(){
  validate_email( this, this.value );
});

Jquery check if input .val() contains certain characters

4 Answers4

Linked