From表单验证神器 BootstrapValidator 使用教程

  • A+
所属分类:BootstrapValidator

From表单验证神器 BootstrapValidator 使用教程

Html

  1. <form id="LoginForm">  
  2.     <div class="form-group">  
  3.         <label>Username</label>  
  4.         <input type="text" class="form-control" name="username" />  
  5.     </div>  
  6.     <div class="form-group">  
  7.         <label>Email address</label>  
  8.         <input type="text" class="form-control" name="email" />  
  9.     </div>  
  10.     <div class="form-group">  
  11.         <button type="submit" name="submit" class="btn btn-primary" onclick="add()">Submit</button>  
  12.     </div>  
  13. </form>  

JavaScript

  1. function add() {  
  2.     alert($("#LoginForm").data('bootstrapValidator').isValid());  
  3. }  
  4. $(function () {  
  5. $('#LoginForm').bootstrapValidator({  
  6.     message: 'This value is not valid',  
  7.     feedbackIcons: {  
  8.         valid: 'glyphicon glyphicon-ok',  
  9.         invalid: 'glyphicon glyphicon-remove',  
  10.         validating: 'glyphicon glyphicon-refresh'  
  11.     },  
  12.     fields: {  
  13.         username: {  
  14.             message: '用户名验证失败',  
  15.             validators: {  
  16.                 notEmpty: {  
  17.                     message: '用户名不能为空'  
  18.                 }  
  19.             }  
  20.         },  
  21.         email: {  
  22.             validators: {  
  23.                 notEmpty: {  
  24.                     message: '邮箱不能为空'  
  25.                 }  
  26.             }  
  27.         }  
  28.     }  
  29. });  
  30. });  
钰玺

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: