表单是我们在开当中的常客,那么对表单的验证也是必须的,那么如何实现动态给表单添加验证规则呢?

方法:

1,动态添加验证规则

// 添加
$("#addConnectUser").rules("add",{rules:{required:true,isString:true},messages:{required:"用户名为必填项",isString:"请输入规范字符"}});
// 移除
$("#addConnectUser").rules('remove','required');

在此我要讲一下为什么有一个isString验证规则;这个是为了限制表单中input的输入规则;比如:不允许特殊字符,或者一些特殊的要求;这个isString是自己配置的

jQuery.validator.addMethod("isString", function(value, element) {
return this.optional(element) || (inputTest.test(value));
},"请输入规范内容");
  // 此处的inputTest为你自定义的验证规则

2,如何给已经添加了表单验证的选项移除验证规则;

$("#addConnectUser").rules("remove",'required');

//再次添加可以直接用
$("#addConnectUser").rules("add",'required');

如何使用validate.js进行动态添加和移除表单验证信息的更多相关文章

  1. vue + element 动态渲染、移除表单并添加验证

    博客地址:https://ainyi.com/66 又接到新需求了吧~~ 背景 在一个大表单里,有可能会出现这种需求,用户可以自己操作动态添加.移除表单,更加个性化的效果. 常见于填写个人信息.附加内 ...

  2. Angular JS 中的内置方法之表单验证

    angular js 结合html5 可以实现强大的表单验证功能 关闭html5自带的表单验证功能可以用

  3. bootstrap-table之通用方法( 时间控件,导出,动态下拉框, 表单验证 ,选中与获取信息)

    1.bootstrap-table 单击单行选中 $('#gzrwTable').on('click-row.bs.table', function(e, row, $element) { $('.s ...

  4. JS常见操作,日期操作,字符串操作,表单验证等

    复制代码 //第一篇博文,希望大家多多支持 /***** BasePage.js 公共的 脚本文件 部分方法需引用jquery库 *****/ //#region 日期操作 //字符串转化为时间. f ...

  5. jquery 动态添加,降低input表单的方法

    html代码例如以下 <html> <tr><button style="margin-left:10px" class="add_fiel ...

  6. ASP.NET MVC Jquery Validate 表单验证的多种方式

    在我们日常开发过程中,前端的表单验证很重要,如果这块处理不当,会出现很多bug .但是如果处理的好,不仅bug会很少,用户体验也会得到很大的提升.在开发过程中我们可以不借助 JS 库,自己去手写 JS ...

  7. 表单验证插件-validator.js 使用教程

    做网站的时候,常常会涉及到各种表单验证.选择一款好用的表单验证插件,会降低表单验证开发的难度.在开发中,我目前使用的表单验证插件是:validator.js. validator.js 是一款轻量的表 ...

  8. jquery.validate.js使用说明——后台添加用户邮箱功能:非空、不能重复、格式正确

    重点内容为:  jQuery验证控件jquery.validate.js使用说明+中文API[http://www.tuicool.com/articles/iABvI3] 简单教程可以参考[jQue ...

  9. JS & JQuery 动态添加 select option

    因为是转载文章 在此标明出处,以前有文章是转的没标明的请谅解,因为有些已经无法找到出处,或者与其它原因. 如有冒犯请联系本人,或删除,或标明出处. 因为好的文章,以前只想收藏,但连接有时候会失效,所以 ...

随机推荐

  1. linux编译注解

    Linux kernel release 3.x <http://kernel.org/> These are the release notes for Linux version 3. ...

  2. Ubuntu12.04安装JDK6

    因为我们要搭建Android2.3的开发环境,只需要安装JDK6就可以,下面是其下载地址: http://www.oracle.com/technetwork/java/javase/download ...

  3. OM Price Lists

      --select * --from org_organization_definitions; --execute fnd_client_info.set_org_context(111); -- ...

  4. jdk1.8.0_101/bin下各文件解释

    appletviewer - Runs applets outside of a web browser. extcheck - Detects version conflicts between a ...

  5. awesome awesomeness

    Awesome Awesomeness A curated list of amazingly awesome awesomeness.Also available on: Awesome-Aweso ...

  6. 各种好用的工具之一 ---- PNGGauntlet

    1.PNGGauntlet实际上是一个图形前端,压缩图像的过程中使用的是PNGOUT, OptiPNG, 和DeflOpt这三款软件. 软件官网:http://pnggauntlet.com/ 可自行 ...

  7. ZOJ 2676 Network Wars ★(最小割算法介绍 && 01分数规划)

    [题意]给出一个带权无向图,求割集,且割集的平均边权最小. [分析] 先尝试着用更一般的形式重新叙述本问题.设向量w表示边的权值,令向量c=(1, 1, 1, --, 1)表示选边的代价,于是原问题等 ...

  8. 【 D3.js 高级系列 — 2.0 】 捆图

    捆图(Bundle)是 D3 中比较奇特的一个布局,只有两个函数,而且需要与其它布局配合使用.本文讲述捆图的制作方法. 有关捆图的例子极少,很容易找到的是:http://bl.ocks.org/mbo ...

  9. CSS sprite 圆角——源代码

    所需图片:                                                                                         corner ...

  10. java问题若干

    1.Java处理本身包含双引号的String 解决:使用转义字符.如:String str = "select * from \"TAB_catalog\" " ...