bootstrap validator html attributes 选项

常用的html属性:data-fv-message="The username is not valid"data-fv-notempty="true"data-fv-notempty-message="The username is required and cannot be empty"data-fv-regexp="true"data-fv-regexp-regexp="^[a-zA-Z0-9_\.]+$"
data-fv-regexp-message="The username can only consist of alphabetical, number, dot and underscore"data-fv-stringlength="true"data-fv-stringlength-min="6"
data-fv-stringlength-max="30"data-fv-stringlength-message="The username must be more than 6 and less than 30 characters long"

如何使用:
  • 页面增加引用

<link href="Styles/bootstrap.css" rel="stylesheet" />
<link href="Styles/bootstrapValidator.css" rel="stylesheet" />
<script src="Scripts/jquery-1.10.2.min.js"></script>
<script src="Scripts/bootstrap.min.js"></script>
<script src="Scripts/bootstrapValidator.js"></script>

  • 按需求增加相应的验证属性

如:<input type="text" class="form-control" name="firstName" placeholder="First name" data-fv-row=".col-xs-4" data-fv-notempty="true" data-fv-notempty-message="The first name is required and cannot be empty" />

  • 页面加载后执行: $("#Form").bootstrapValidator(options)
    有关options 说明请参考:http://bv.doc.javake.cn/settings/
时间: 2024-10-31 20:11:54

bootstrap validator html attributes 选项的相关文章

BootStrap Validator 版本差异问题导致的submitHandler失效问题的解决方法

最近一直在做互金平台,做到后台提交表单的时候出现验证提交数据一直没有提交的问题.于是百度了一下.果然是版本问题造成的.幸好找到了问题所在.我一直仿照的是东钿原微信平台的做法,但是使用byond的后台框架,可能版本不一样,所以造成 submitHandler: function(validator, form, submitButton) { // 版本号0.4.5支持 // 版本号v0.5.2-dev不再支持submitHandler配置 } 这个方法一直是无效的无法执行.百度搜到就是以下解决办

bootstrap validator 使用 带代码

如何使用bootstrapVlidator插件? 下载bootstrapVlidator插件 在需要使用的页面引入bootstrapVlidator的js文件和css文件 如: 注: 在此基础之前必须引入jquery库和bootstrap的js文件和css样式. 如: 放入所需插件 引入路径 3.表单代码: <form id="registForm"> <!--下面是用户名输入框--> <div class="form-group"&g

Bootstrap Validator使用特性,动态(Dynamic)添加的input的验证问题

http://1000hz.github.io/bootstrap-validator/#validator-usage Validated fields By default, the validator will only validate fields that are present when the plugin is initialized. If your form has a dynamic set of fields, you will need to call $(...).

BootStrap Validator

表单验证,必须有Form表单,需要用到form-group 如果使用了 input-group 无法显示出 校验提示 <div class="input-group"> <span class="input-group-addon">姓名</span> <input type="text" id="username" class="form-control" val

Bootstrap Css

Bootstrap 1.Bootstrap 是一个用于快速开发 Web 应用程序和网站的前端框架.Bootstrap 是基于 HTML.CSS.JAVASCRIPT 的.您可以从 http://getbootstrap.com/ 上下载 Bootstrap 的最新版本. 2.实例采用的是百度的静态资源库(http://cdn.code.baidu.com/)上的Bootstrap资源.百度的静态资源库的 CDN 服务,访问速度更快.加速效果更明显.没有速度和带宽限制.永久免费,引入代码如下: h

前端基础之Bootstrap介绍

bootstrap简介 http://v3.bootcss.com/ Bootstrap优点:  下载:  Bootstrap引入 <meta name="viewport" content="width=device-width, initial-scale=1"> <link href="dist/css/bootstrap.min.css" rel="stylesheet"> <script

Bootstrap CSS(三)

1.Bootstrap 按钮 任何带有 class .btn 的元素都会继承圆角灰色按钮的默认外观.Bootstrap 提供了一些选项来定义按钮的样式,可用于<a>, <button>, 或 <input> 元素. 例如:btn btn-default btn-primary btn-success btn-info btn-warning btn-danger btn-link 1.1按钮大小 1.2按钮状态 1.2.1激活状态 1.2.2禁用状态 1.3按钮标签 &

Bootstrap 按钮,图片,辅助类

Bootstrap 按钮 任何带有 class .btn 的元素都会继承圆角灰色按钮的默认外观.但是 Bootstrap 提供了一些选项来定义按钮的样式,具体如下表所示: 以下样式可用于<a>, <button>, 或 <input> 元素上: 类 描述 实例 .btn 为按钮添加基本样式 尝试一下 .btn-default 默认/标准按钮 尝试一下 .btn-primary 原始按钮样式(未被操作) 尝试一下 .btn-success 表示成功的动作 尝试一下 .bt

BootStrap入门教程 (转载)

2011年,twitter的“一小撮”工程师为了提高他们内部的分析和管理能力,用业余时间为他们的产品构建了一套易用.优雅.灵活.可扩展的前端工具集--BootStrap.Bootstrap由MARK OTTO和Jacob Thornton所设计和建立,在github上开源之后,迅速成为该站上最多人watch&fork的项目.大量工程师踊跃为该项目贡献代码,社区惊人地活跃,代码版本进化非常快速,官方文档质量极其高(可以说是优雅),同时涌现了许多基于Bootstrap建设的网站:界面清新.简洁;要素