jQuery field validation - empty or not, and correct values?

Question

I have a relatively simple set of inputs that need correct validation, and I seem to have a hiccup so far. Upon clicking send, only the empty fields should be filled in with the .errorVal class to give them a red background. So that is the visual side of the validation. Also, I need these fields to have character validation. So, First and Last name cannot contain numbers. Email needs to have an @ symbol at some point. Any ideas?

http://jsbin.com/OlUGiXE/1/edit?html,css,js,output

$('.sendSupport').click(function () {
    if ($("table.forceCenter > input[type=text]:empty").length == 0 && $("textarea:empty").length == 0) {
        //alert('sent')
        $('.sentVal').fadeIn();
        $('.emptyVal').hide();
        // clear values
        $("input[type=text], textarea").val('').removeClass('errorVal');
    } else {
        //alert('empty')
        $('.emptyVal, .errorStar').fadeIn();
        $('.sentVal').hide();
        $("input[type=text]:empty, textarea:empty").addClass('errorVal');
    }
});

look at a validation framework like [jQuery validation](http://jqueryvalidation.org/) — Arun P Johny, Dec 02 '13 at 15:15
As stated above take a look at jQuery Validation. It saves headaches. It has most of your normal validation requirements baked in. — buzzsawddog, Dec 02 '13 at 15:18
if you can't use a plugin then you must write your own validation rules. You should look into Regular Expressions to realize your rules. — Sven Bieder, Dec 02 '13 at 15:26
look at http://jsfiddle.net/arunpjohny/4B8GJ/1/ how easy it is — Arun P Johny, Dec 02 '13 at 15:26
The [empty](http://api.jquery.com/empty-selector/) selector does not do what you think it is doing, it just checks whether an element has child nodes — Arun P Johny, Dec 02 '13 at 15:29

score 0 · Answer 1 · edited May 23 '17 at 10:31

To check if every input is not empty you can do something like this:

jQuery("input[type=text]").each(function() 
    {  

if($(this).val()=="")
 {
 $(this).addClass("errorVal");
}   

});

To check if an input have a number take a look at the link below:

Check whether an input string contains number

And if an input contains "@" read this Jquery check if input .val() contains certain characters

jQuery field validation - empty or not, and correct values?

1 Answers1