密码更改jQuery验证错误消息未出现

时间:2020-02-17 22:44:32

标签: javascript jquery

我输入错误的匹配密码时遇到问题-jQuery验证错误消息未出现。

jQuery.validator.setDefaults({
    debug: true,
    success: "valid"
});

$('#passwordchange').validate({
    rules:{
        newpass:{
            required: true
        },
        retypepass:{
            required:true,
            equalto: '#newpassword'
        }
    },
    messages:{
        retypepass:{
            equalto:"should enter matching pass"
        }
    }
});

Here is the full code on codepen

1 个答案:

答案 0 :(得分:0)

由于@Azametzin的评论和document,您应该使用equalTo而不是equalto

语法

equalTo (其他)返回:布尔值

描述:需要元素 与另一个相同

jQuery.validator.setDefaults({
  debug: true,
  success: "valid"
});

$('#passwordchange').validate({
        rules:{
            newpass:{
                required: true
            },
            retypepass:{
                required:true,
                equalTo: '#newpassword'
            }
        },
  messages:{
    retypepass:{
      equalTo:"should enter matching pass"
    }
  }
    });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/jquery-validation@1.19.1/dist/jquery.validate.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery.validation/1.16.0/additional-methods.min.js"></script>


<form method="GET" action="" id="passwordchange">
     <div class="form-row">
         <div class="form-group row no-gutters col-12">
           <label for="newpassword" class="col-md-3">كلمة المرور الجديدة</label>
           <div class="col-md-9">
             <input type="password" class="form-control" id="newpassword" name="newpass" placeholder="GHIBKL@$*132581">
           </div>
       </div>
                        
  </div>
  <div class="form-row">
    <div class="form-group row no-gutters col-12">
      <label for="retype" class="col-md-3">إعادة كلمة المرور</label>
      <div class="col-md-9">
        <input type="password" class="form-control" id="retype" name="retypepass" placeholder="GHIBKL@$*132581">
      </div>
    </div>

  </div>
  <button type="submit">submit</button>                                             

</form>