Bootstrap validation du formulaire ne fonctionne pas

-1

Je suis en train de valider champ nom d'utilisateur et mot de passe en utilisant validateur bootstrap J'ai inclus css et js pour validateur bootstrap. form id valider est #loginBootstrap validation du formulaire ne fonctionne pas

code

est comme ci-dessous

<head> 
    <script type='text/javascript' src='js/jquery-2.1.1.min.js'></script> 
      <script type="text/javascript" src="js/jquery-ui.js"></script> 
         <link rel="stylesheet" href="js/bootstrap-3.1.1-dist/css/bootstrap.min.css"/> 
      <link rel="stylesheet" href="js/bootstrap-3.1.1-dist/css/bootstrap-theme.min.css"/> 
      <script type='text/javascript' src="js/bootstrapvalidator-dist-0.4.5/dist/js/bootstrapValidator.min.js"></script> 
      <script type='text/javascript' src="js/bootstrapvalidator-dist-0.4.5/dist/css/bootstrapValidator.min.css"></script> 
      <script> 
       $(document).ready(function() { 
        $('#login').bootstrapValidator({ 
         feedbackIcons: { 
          valid: 'glyphicon glyphicon-ok', 
          invalid: 'glyphicon glyphicon-remove', 
          validating: 'glyphicon glyphicon-refresh' 
         }, 
         fields: { 
          userName: { 
           validators: { 
            notEmpty: { 
             message: 'User Name required' 
            } 
           } 
          }, 
          password: { 
           validators: { 
            notEmpty: { 
             message: 'TPassword required' 
            } 
           } 
          } 
         } 
        }); 
       });</script> 
</head> 
    <body> 
    <form action="login" method="post" id="login" > 
            <div class="form-group"> 
             <label class="control-label" for="userName"> 
              User Id 
             </label> 
             <input type="text" placeholder="Username" name="userName" id="userName" class="form-control lgn"> 
            </div> 
            <div class="form-group"> 
             <label class="control-label" for="Password"> 
              Password 
             </label> 
             <input type="password" placeholder="Password" name="password" id="password" class="form-control lgn"> 
            </div> 
            <div class="form-group"> 
             <button type="submit" class="btn btn-success lgn" >Login</button> 
            </div> 
           </form> 
    </body>

Comment résoudre ce problème.

violon démo jsfiddle.net/xrcwrn/3bthv

Source

2014-07-26 xrcwrn

Here is a working fiddle

Le problème est que votre code js contenu dans les erreurs de syntaxe de violon endigués. La console doit être la première chose que vous vérifiez lorsque votre javascript ne fonctionne pas comme prévu. J'ai commenté dans le code ci-dessous les changements que j'ai faits pour que le violon fonctionne. (Il semble que le code dans votre question est bien que)

$(document).ready(function() { 
    $('#login').bootstrapValidator({ 
     feedbackIcons: { 
      valid: 'glyphicon glyphicon-ok', 
      invalid: 'glyphicon glyphicon-remove', 
      validating: 'glyphicon glyphicon-refresh' 
     }, 
     fields: { 
      userName: { 
       validators: { 
        notEmpty: { 
         message: 'The first name is required and cannot be empty' 
        } 
       } 
      }, 
      password: { 
       validators: { 
        notEmpty: { 
         message: 'The last name is required and cannot be empty' 
        } 
       } 
      } /* <-- removed unneeded comma */ 
     } /* <-- added closing brace */ 
    }); 
});

Source

2014-07-27 12:20:58 dmullings

Bootstrap validation du formulaire ne fonctionne pas

Répondre

Questions connexes