jQueryの検証equalToは、私はここに私のGrailsアプリケーションで<a href="https://jqueryvalidation.org/" rel="nofollow">jQuery Validate plugin</a>、 を使用していますGrailsの

Question

で作業していない検証のためのGSPからのコードは次のとおりです。

<script type="text/javascript"> 

    $(document).ready(function() { 
     $('.save').attr('disabled', true); 
     jQuery.validator.addMethod("noSpace", function(value, element,e) { 

     return value.indexOf(" ") < 0 && value != ""; 
      }, "${message(code:'sherif.jqueryValidation.nospaces')}"); 


    $('#myForm').validate({ 

     errorElement: "label", 
     errorClass:'error', 
     success: function() { 
     $('.save').attr('disabled', false); 
     }, 
     rules : 
      { 
      username:{required : true,noSpace:true}, 
      password :{required : true,noSpace:true}, 
      confirmPassword:{required : true,noSpace:true,equalTo:"#password"}, 
      contactNumber: { required : true, number:true}, 
      email:{required:true , email:true} 
      } 
    , 
     messages : { 
      username:{required :"${message(code:'sherif.jqueryValidation.required')}"}, 
      password : {required :"${message(code:'sherif.jqueryValidation.required')}"}, 
      email:{required :"${message(code:'sherif.jqueryValidation.required')}" , email:"${message(code:'sherif.jqueryValidation.invalidemail')}"}, 
      confirmPassword: {required :"${message(code:'sherif.jqueryValidation.required')}" , equalTo:"${message(code:'sherif.jqueryValidation.passwordmatch')}"}, 
      contactNumber: { required : "${message(code:'sherif.jqueryValidation.required')}", number:"${message(code:'sherif.jqueryValidation.numberonly')}"} 
    } 

    }); 
}); 
</script> 

すべての検証はするが、equalTo検証を除いて正常に動作しています2つのパスワードフィールドは同じ値を持っていますが、password doesn't matchエラーが発生します。ここで

は、パスワードのフィールドです：

<div class="row form-group"> 

    <div class="fieldcontain ${hasErrors(bean: usersInstance, field: 'password', 'error')} required"> 
    <div class="col-sm-2 "><label for="password"> 
     <g:message code="users.password.label" default="Password" /> 
     <span class="required-indicator">*</span> 
    </label> 
    </div> 
    <div class="col-sm-10"> <g:passwordField style = "width:40%;" class="form-control input" name="password" required="" value="${usersInstance?.password}"/> 
    </div> 
    </div> 
</div> 

<div class="row form-group"> 
<div class="fieldcontain ${hasErrors(bean: usersInstance, field: 'confirmPassword', 'error')} required"> 
    <div class="col-sm-3 "><label for="confirmPassword"> 
     <g:message code="users.confirmPassword.label" default="confirm Password" /> 
     <span class="required-indicator">*</span> 
    </label> 
    </div> 
<div class="col-sm-9"> <g:passwordField style = "width:40%;" class="form-control input" name="confirmPassword" required="" value="${usersInstance?.confirmPassword}"/> 
</div> 
</div> 
</div> 

は、このエラーが発生することがあり、私は逃したものはありますか？

Answer 1

... 2つのパスワードフィールドの値は同じですが、"password doesn't match"というエラーが表示されます。

#passwordに一致する要素がない場合、この条件が表示されます。

equalTo: "#password" 

あなた#passwordセレクタはid="password"を含む要素を探しています。あなたがこの要素にid属性を追加することができない場合は、nameで一致すれば、以下の通りに、試すことができます...

equalTo: "[name='password']" 

DEMO：jsfiddle.net/68a9fkgt/