Jquery Validation

การเขียน Verify อย่างง่าย ด้วย jQuery

HTML

<form id="registration" class="form_registration" method="post" name="registration">&nbsp;
<div class="form-group"><label class="control-label">Email</label> <input id="a_email" name="a_email" type="email" /></div>
&nbsp;
<div class="form-group"><label class="control-label">Name</label> <input id="a_name" name="a_name" type="text" /></div>
&nbsp;
<div class="form-group">

&nbsp;
<div class="check-box"><label> <input id="a_term" name="a_term" type="checkbox" /> </label></div>
&nbsp;

</div>

</form>

à¹à¸¡à¸·à¹à¸­ verify error à¸à¸°à¹à¸à¸´à¹à¸¡ class <code>.has-error</code> à¹à¸«à¹à¸à¸±à¸ สà¹à¸§à¸à¸à¸µà¹ error à¹à¸¥à¸° text à¸à¸µà¹à¸à¸³à¸«à¸à¸à¹à¸«à¹ error à¹à¸ class <code>.help-block</code> à¸à¸²à¸¡à¸à¹à¸²à¸à¸¥à¹à¸²à¸
<div class="form-group has-error"><label class="control-label">Name</label> <input id="a_name" name="a_name" type="text" /> <span class="help-block">Please insert name.</span></div>
à¹à¸¡à¸·à¹à¸­ verify success à¸à¸°à¹à¸à¸´à¹à¸¡ class <code>.has-success</code> à¹à¸«à¹à¸à¸±à¸ สà¹à¸§à¸à¸à¸µà¹ success à¸à¸²à¸¡à¸à¹à¸²à¸à¸¥à¹à¸²à¸
<pre class="prettyprint">

Js

  
jQuery(document).ready(function(){
    $('.form_registration').validate({
      rules: {
        a_email:{ required: true },
        a_name: { required: true },
        a_term: { 
          required: true 
          minlength: 1 
        }
      },
      message: {
        a_email: {  required: "Please insert email."},
        a_name: {  required: "Please insert name."},
        a_term: {  required: "Please accept term."}
      },
      success: function(e) {
         $(e).closest('.form-group').removeClass('has-error').addClass('has-success');
         $(e).remove();
      },
      errorPlacement: function(error, element) {
         $(element).closest('.form-group').removeClass('has-success').addClass('has-error');
         $(element).closest('.form-group').find(".help-block").append(error);

      }
    });
  });

19 total views, 1 views today

You may also like

Leave a Reply

Your email address will not be published. Required fields are marked *