Question

Please look at this code, and tell me why even when my errors DO get triggered that my error variable still screams 0. I have tried and tried and tried to get them to change. I am just lost at this point.

validationError = 0;
$("#step1continue").click(function(){

        var fname = $('#fname');
        if (fname.val() == "") {
            fname.addClass("needsfilled");
            fname.val('Required!');
                       validationError = 1;
        } else {
                  validationError = 0;
        }

        var lname = $('#lname');
        if (lname.val() == "") {
            lname.addClass("needsfilled");
            lname.val('Required!');
                        validationError = 1;
        } else {
                 validationError = 0;
        }

        var company_name = $('#company_name');
        if (company_name.val() == "") {
            company_name.addClass("needsfilled");
            company_name.val('Required!');
                        validationError = 1;
        } else {
                  validationError = 0;
        }

        var email = $('#email');
        if (email.val() == "") {
            email.addClass("needsfilled");
            email.val('Required!');
                       validationError = 1;
        } else {
                  validationError = 0;
        }

         var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
               if (!emailReg.test(email.val())) {
                        email.addClass("needsfilled");
            email.val('Use a real email address!');
                       validationError = 1;
        } else {
                 validationError = 0;
        }

         var phone = $('#phone');
                if (phone.val() == "") {
            phone.addClass("needsfilled");
            phone.val('Required!');
                        validationError = 1;
        } else {
                  validationError = 0;
        }
                if (phone.val().length < 10) {
            phone.addClass("needsfilled");
            phone.val('10 digits minimum');
                        validationError = 1;
        } else {
                 validationError = 0;
        }   

                var phoneregxp = /^[0-9]$/;
                if (phoneregxp.test(phone.val())) {
                        phone.addClass("needsfilled");
            phone.val('Numbers ONLY');
                        validationError = 1;
        } else {
                  validationError = 0;
        }   

      alert(validationError);

});

Answer 1

Because you continually reset your validationError on every successful check?

If (say) #fname isn’t filled out, you set validationError to be 1. That’s fine. But then you check #lname, and oops… that’s one filled out, so now validationError is 0 again.

Instead of a simple on/off value that gets yanked around like crazy, why not INCREMENT the value everytime there’s an error?

validationError = 0;
if (...) { validationError++ }
if (...) { validationError++ }
if (validationError > 0) {
   alert('You have ' + validationError + ' errors');
}