1

I am using jQuery to validate a form (firstName, lastName, and email). I have successfully validate the email portion of the form however I would like to know how to validate the firstName and lastName input fields?

jQuery Validation script:

email validation (working):

var patt =  /^.+@.+[.].{2,}$/i;

    if(!patt.test(ele.val())) {
        jVal.errors = true;
                    emailInfo.removeClass('correct').addClass('error').html('X').show();
        ele.removeClass('normal').addClass('wrong');
            }else{
                    emailInfo.removeClass('error').addClass('correct').html('√').show();
                    ele.removeClass('wrong').addClass('normal');
            }

        },

firstName validation (not working):

var patt =  /^[a-zA-Z'-]+$/;

        if(!patt.test(ele.val()).length < 2) {
            jVal.errors = true;
                firstNameInfo.removeClass('correct').addClass('error').html('X').show();
                ele.removeClass('normal').addClass('wrong');
        } else {
                firstNameInfo.removeClass('error').addClass('correct').html('&radic;').show()
                ele.removeClass('wrong').addClass('normal');
            }
        },
Sparky
  • 98,165
  • 25
  • 199
  • 285
  • Why reinvent the wheel? The [jQuery Validation plugin](http://bassistance.de/jquery-plugins/jquery-plugin-validation/) has this functionality already built in. – Sparky Aug 17 '12 at 02:34
  • I [reinvented the wheel](http://elclanrs.github.com/jq-idealforms/) but on acid! – elclanrs Aug 17 '12 at 02:35
  • **@user1584751** here's [an answer](http://stackoverflow.com/questions/9674148/jquery-form-validation-how-to-iterate/9674338#9674338) I posted a while ago for a similar problem. – elclanrs Aug 17 '12 at 02:38
  • 1
    Thanks everyone the validation jQuery script is validating my form properly. :) –  Aug 17 '12 at 02:58

2 Answers2

2

call https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.15.0/jquery.validate.min.js at last of html code

$('#formId').validate({
            rules: {
                firstname: {
                    minlength: 3,
                    maxlength: 30,
                    pattern: "^[a-zA-Z_]*$",
                    required: true
                },
                 lastname: {
                    minlength: 3,
                    maxlength: 30, 
                    pattern: "^[a-zA-Z_]*$",
                    required:true
                }
     },
            highlight: function(element) {
                $(element).closest('.form-group').addClass('has-error');
            },
            unhighlight: function(element) {
                $(element).closest('.form-group').removeClass('has-error');
            },
            errorElement: 'span',
            errorClass: 'help-block',
            errorPlacement: function(error, element) {
                if(element.parent('.input-group').length) {
                    error.insertAfter(element.parent());
                } else {
                    error.insertAfter(element);
                }
            }
        });
Suwarnakumar Kanapathipillai
  • 375
  • 3
  • 6
0

we must have found the same jquery form validation page... any who im writing a form as well with it and found answer to your question - hope ya still need it if not help others maybe...

   var regex = new RegExp("[0-9]");
   var match = regex.exec($('#firstname').val());
   if(ele.val().length < 2 || match) {
//do stuff

so the first part in the if is not related but the Match part is, checks if there are any numbers in the string and if so ... in my case i have it showing the error div...I didn't want to copy all of the code.

Hope this helps Joe CustomWebsites4Less.com

If ya need an example i should have this on a live site within a the week...

Joe
  • 19
  • 2