码迷,mamicode.com
首页 > 其他好文 > 详细

BootstrapValidator 验证表单

时间:2016-07-25 09:18:12      阅读:279      评论:0      收藏:0      [点我收藏+]

标签:

在线实例

实例演示

使用方法

  1. <form id="defaultForm" method="post" class="form-horizontal" action="target.php"> 
  2.     <div class="form-group"> 
  3.         <label class="col-lg-3 control-label">用户名</label> 
  4.         <div class="col-lg-5"> 
  5.             <input type="text" class="form-control" name="username" /> 
  6.         </div> 
  7.     </div> 
  8.  
  9.     <div class="form-group"> 
  10.         <label class="col-lg-3 control-label">邮箱</label> 
  11.         <div class="col-lg-5"> 
  12.             <input type="text" class="form-control" name="email" /> 
  13.         </div> 
  14.     </div> 
  15.  
  16.     <div class="form-group"> 
  17.         <label class="col-lg-3 control-label">生日</label> 
  18.         <div class="col-lg-5"> 
  19.             <input type="text" class="form-control" name="birthday" /> (YYYY/MM/DD) 
  20.         </div> 
  21.     </div> 
  22.  
  23.     <div class="form-group"> 
  24.         <div class="col-lg-9 col-lg-offset-3"> 
  25.             <button type="submit" class="btn btn-primary" name="signup" value="Sign up">提交</button> 
  26.             <button type="button" class="btn btn-info" id="validateBtn">自动验证</button> 
  27.             <button type="button" class="btn btn-info" id="resetBtn">重置表单</button> 
  28.         </div> 
  29.     </div> 
  30. </form>
复制
  1. $(‘#defaultForm‘).bootstrapValidator({ 
  2.     message: ‘This value is not valid‘, 
  3.     feedbackIcons: { 
  4.         valid: ‘glyphicon glyphicon-ok‘, 
  5.         invalid: ‘glyphicon glyphicon-remove‘, 
  6.         validating: ‘glyphicon glyphicon-refresh‘ 
  7.     }, 
  8.     fields: { 
  9.         username: { 
  10.             message: ‘The username is not valid‘, 
  11.             validators: { 
  12.                 notEmpty: { 
  13.                     message: ‘The username is required and cannot be empty‘ 
  14.                 }, 
  15.                 stringLength: { 
  16.                     min: 6, 
  17.                     max: 30, 
  18.                     message: ‘The username must be more than 6 and less than 30 characters long‘ 
  19.                 }, 
  20.                 regexp: { 
  21.                     regexp: /^[a-zA-Z0-9_\.]+$/, 
  22.                     message: ‘The username can only consist of alphabetical, number, dot and underscore‘ 
  23.                 }, 
  24.                 remote: { 
  25.                     url: ‘remote.php‘, 
  26.                     message: ‘The username is not available‘ 
  27.                 }, 
  28.                 different: { 
  29.                     field: ‘password‘, 
  30.                     message: ‘The username and password cannot be the same as each other‘ 
  31.                 } 
  32.             } 
  33.         }, 
  34.         email: { 
  35.             validators: { 
  36.                 emailAddress: { 
  37.                     message: ‘The input is not a valid email address‘ 
  38.                 } 
  39.             } 
  40.         }, 
  41.     } 
  42. });
复制

参数详解

参数 描述 默认值
defaultSubmit 默认提交表单 -
disableSubmitButtons 禁用或启用提交按钮 -
enableFieldValidators 启用/禁用所有给定的字段验证器 (如果 true,使字段验证器。如果 false禁用字段验证器) -
getFieldElements 检索字段元素的名字 -
isValid 返回 true如果所有的表单字段是有效的。否则,返回 false. -
resetForm 重置表单 -
updateElementStatus 更新验证给定元素的结果 -
updateStatus(field, status, validatorName) 更新为给定字段验证器的结果,status可以 NOT_VALIDATED, VALIDATING, INVALID或 VALID,validatorName 字符串 验证器的名称。如果 null所有验证器,更新方法有效性的结果 -

 

BootstrapValidator 验证表单

标签:

原文地址:http://www.cnblogs.com/androidshouce/p/5702310.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!