开发者

jquery validation plugin

someone ha开发者_开发技巧s used this jquery plugin for form validation?

http://docs.jquery.com/Plugins/Validation

i cant figure out how to use it. it doesnt say anything in the documentation how to name the html form elements to make it work with the validate() method.

and question nr 2, what php class validation is there to use for the server side?

EDIT: why doesnt this work:

$("#register_box_form").validate({
    rules: {
        name: {
            required: true,
            minlength: 3
        }

        email: {
            required: true,
            minlength: 3,
            email: true
        }
    }
});


<input type="text" id="email" name="email" class="required email" />, in this code, values for the class attribute 'required' and 'email' act same as the rules define in validate method in document ready function. That means class="required email" equals to,

email: {
          required: true,
          email: true
        }

in above example. I will tell what are the steps needed for including jquery validation. (you may already know each and every step) For use jquery validtion, First you have to include main jquery library js file and jquery validation plugin js file. Then on the document on ready function, you have to bind validate function to required form ( as mentioned in the example of above post). You can either declare validation rules in this validate function or as values for class attribute of the relevant input element as I have described above. Sometimes I have got problems when I use different values for id attribute and name attribute for input elements. I don't know the reason for it. So try to give the same values for id and name attributes and check if still validation not works.

You can use already included validation rules such as email, url, number, digit etc. and also there is a rule called "remote" which can use for sending ajax request and do validation in server side. In addition to that you can define custom rules according to your needs. For example, I used following code to add custom validation rule for ensuring passwords are in correct password policy.

$.validator.addMethod("passwd_policy", function( value, element, param ) {
        return this.optional(element)
            || (value.length >= 8
                && /.[!,@,#,$,%,^,&,*,?,_,~]/.test(value) 
                && /[0-9]/.test(value)
                && /[a-z]/.test(value)
                && /[A-Z]/.test(value));
    },"Your password must be at least 8 characters long, <br/>contain at least one number, <br/>"
      +" at least one special character (!,@,#,$,%,^,&,*,?,_ ,~),<br/> at least one uppercase"
      +" character  <br/>and at least one lowercase character.");

You can add this custom validation method to validate a field as same as using inbuilt methods. that is like

   "txt_passwd": {
        passwd_policy: true
    },


You specify rules for the fields in the form. They are key/value pairs where the key is the name of the field.

E.g. a form with the fields name and email (from the documentation at http://docs.jquery.com/Plugins/Validation/validate#options)

$(".selector").validate({
   rules: {
     // simple rule, converted to {required:true}
     name: "required",
     // compound rule
     email: {
       required: true,
       email: true
     }
   }
})

You can use the Zend Framework for the php part. It has some JQuery integration, though not for the Validation plugin (yet?).

edit: In your example there is a comma missing between the two elements of your rules literal.

<html>
  <head>
    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/validate/jquery.validate.js"></script>
    <script type="text/javascript">
      $(document).ready(function() {
        $("#register_box_form").validate( {
          rules: {
            name: {
              required: true,
              minlength: 3
            },
            email: {
              required: true,
              email: true
            }
          }
        });
      });
    </script>
  </head>
  <body>
    <form method="post" action="?" id="register_box_form">
      <div>
        <input type="text" name="name" /><br />  
        <input type="text" name="email" /><br />
        <input type="submit" />
      </div>
    </form>
  </body>
</html>
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜