ブートストラップを持つjspのbootstrapValidatorに奇妙なエラーがあります

Question

私は自分のフォーム（ブートストラップの登録とログインのモーダル）を検証するために 'bootstrapvalidator'を使用しています。これまでのところ、正しいデータを入力すると、のログインと入力してください。ログインボタン（はのログインフォームを送信します）は無効になりますが、パスワードフィールドから数字をクリアしてもう一度入力すると無効になります。フォームを提出するフォームを提出しようとします。

なぜこれが起こっているのか、何が原因でエラーが発生しているのか分かりません。

私はhttps://cdnjs.comからのcdnsを使用しています。合計8 cdnのリンクにあります。

マイフォームコード（モーダルログイン）

<div id="login" class="modal fade " role="dialog"> 
<div class="modal-dialog login-modal"> 
    <div class="modal-content"> 
     <form action="logindone.jsp" method="post" class="form-horizontal" role="form"> 
      <div class="modal-header"> 
       <a class="close cross" data-dismiss="modal">x</a> 
       <h3>Login</h3> 
      </div> 
      <div class="modal-body"> 
       <div class="form-group"> 
        <label for="email-name" class="col-md-2 control-label glyphicon glyphicon-user"></label> 
        <div class="col-md-10"> 
         <input type="email" class="form-control" id="email-name" name="email"> 
        </div> 
       </div> 
       <div class="form-group"> 
        <label for="email-pass" class="col-md-2 control-label glyphicon glyphicon-lock"></label> 
        <div class="col-md-10"> 
         <input type="password" class="form-control" id="email-pass" name="password"> 
        </div> 
       </div> 
      </div> 
      <div class="modal-footer modal-footer-hidden-border"> 
       <a href="#" class="btn btn-link" data-dismiss="modal">Forgot password ?</a> 
       <button type="submit" value="submit" class="btn btn-danger btn-circle-lg glyphicon">Log in</button> 
      </div> 
     </form> 
     </div> 
    </div> 
</div> 

私のブートストラップ・バリコード

<script> 
$(document).ready(function() { 
    var validator = $('#login').bootstrapValidator({ 
    fields: { 
     email: { 
     message: "Email is required", 
     validators: { 
      notEmpty: { 
      message: "Please provide an email address" 
      }, 
      stringLength: { 
      min: 6, 
      max: 35, 
      message: "Email must be between 6 and 35 characters long" 
      }, 

      emailAddress: { 
      message: "Email address must be valid" 
      }, 
      regexp: { 
      regexp: /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/, 
      message: 'Not a valid email address' 
      } 

     } 
     }, //.email 
     password: { 
     validators: { 
      notEmpty: { 
      message: "Password is required" 
      }, 
      stringLength: { 
      min: 8, 
      message: "Password must be 8 characters long" 
      }, 
      different: { 
      field: "email", 
      message: "Email and Password must be different" 
      } 
     } 
     } 
    } 
    }); 
}); 
</script> 

Answer 1

コードでずっと間違って何もありませんが、唯一の問題はここにあなたがターゲットとしている$('#login')ですモーダルID、

var validator = $('#login').bootstrapValidator({ //validation code }); 

は、あなたはとてもform例えばid="loginForm"異なるその後、モーダルIDにIDを割り当てるform selector読むHow to call the plugin

を対象とする必要があります。

<form action="logindone.jsp" id="loginForm" method="post" class="form-horizontal" role="form"> 

とbootstrapValidatorコードが

var validator = $('#loginForm').bootstrapValidator({ //validation code }); 

残りはすべての良い

ワーキングFiddle例