自定义jquery验证器

时间:2012-08-22 08:57:31

标签: javascript jquery jquery-validate validation

我有以下代码:

<form id="reg_form_pay" class="fancy_form" action="" method="POST">
  <div class="wrap_input" style="margin-bottom: 10px;">
    <p class="inp_label">Firstname:</p>
    <i> </i>
    <input id="pay_firstname" type="text" value="" name="FirstName" style="width: 157px;">
  </div>
  <div class="wrap_input" style="margin-bottom: 10px;">
    <p class="inp_label">Surname:</p>
    <i> </i>
    <input id="pay_lastname" type="text" value="" name="Surname" style="width: 157px;">
  </div>
  <div class="wrap_input" style="margin-bottom: 10px; margin-top: 34px;">
    <p class="inp_label">E-mail:</p>
    <i> </i>
    <input id="pay_email" type="text" value="" name="Email" style="width: 157px;">
  </div>
  <div class="wrap_input" style="margin-top: 34px;">
    <p class="inp_label">Phone:</p>
    <i> </i>
    <input id="pay_phone" type="text" value="" name="PhoneNumber" style="width: 157px;">
  </div>
</form>

验证:

$("#reg_form_pay").validate({
            rules: {
                Email: { required: true, email: true, checkEmail: true },
                PhoneNumber: { required: true, checkPhoneNumber: true },
                FirstName: { required: true },
                Surname: { required: true }
            }, 
        });

默认情况下,验证为false时验证程序写label。我不想添加带有错误描述的元素。我想将课程error添加到课程div的父wrap_input。我怎么能跟验证员说这个呢? 感谢。

1 个答案:

答案 0 :(得分:1)

将此添加到发送到validate的选项可以正常工作:

showErrors: function(errorMap, errorList) {
    $.each(errorList,function(i,e){
        $(e.element).parents('.wrap_input').addClass('error');
    });                   
}

实例:http://jsfiddle.net/nqp8J/