加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

Bootstrap 表单验证formValidation 实现表单动态验证功能

发布时间:2020-12-18 00:37:55 所属栏目:安全 来源:网络整理
导读:动态添加input并动态添加新验证方式! init状态: 点击“+”后: 验证后: 知识点: 1 先去官网下载: 2 导入文件,注意事项我就不多说了在远程验证那篇我已经讲过。 3 用到的关键字:addField、removeField、different 4注意一点就是官网里的例子他们的name

动态添加input并动态添加新验证方式!

init状态:

这里写图片描述

点击“+”后:

这里写图片描述

验证后:

这里写图片描述

知识点:

1 先去官网下载:

2 导入文件,注意事项我就不多说了在远程验证那篇我已经讲过。

3 用到的关键字:addField、removeField、different

4注意一点就是官网里的例子他们的name是不一样的。我这里比较偷懒。且项目ajax的时候不是用的form表单提交,而是自己并接成json提交,所以x,y的name的名字一样。

好开始:

首先是在html里面必须要有一个 “+” 标记为addPos,然后有一个“-” 标记为“removPos,

设置车库xy坐标

然后来个js:

因为我的项目有多个表单提交。但是业务相似所以都用这几个函数

比如说: var form=(“#”+panelId+”form”)用panelId来区分是多个表单。

上面说到x,y的name用的是一样的。但是细心的就会发现garageNo是不一样的名称。后面添加了bookindex,为什么呢。

因为业务需求。同一个表单中的garageNo的值不可以相同。好比如说每一个人的身份号不可以相同但是你和你同桌都可以是女的也都可以18岁。。。。

上面已经很好的使用了关键字removeField和addField

garageNo的值不可以相同。怎么弄呢。请看下面:

当用户输入garageNo的值后:

这个diffArr.toString(),是啥呢。这个是我遍历了所有条目的garageNo的name的字符串例如:有3条条目,idx=1 焦点在1上。那么diffArr=[“garageNo0”,”garageNo2”,]

这里写图片描述

注意一个bug:如果用多了input,你会发现有时input不会自动验证。比如说验证日期的时候用了日期插件点击日期回来后input没有验证。

这个时候就需要再手动验证一次。 上面那段代码是 先添加新的验证方式,然后验证整个表单。如果你只是想要验证一个input 请用:

还有一个关于提交的细节:

当我们没有设置提交按钮。比起提交按钮在form表单内。他这个插件是会帮你自动提交。但是你也会发现。如果你提交服务失败。他会自动刷新然后你的页面就变成404页面或其他错误页面。

但是有的时候我们不想他刷新。咋办?

网上好多ajax 提交不刷新的教程。。我比较喜欢用一种就是。我不把提交按钮放在form里面。然后:

以上所述是小编给大家介绍的Bootstrap 表单验证formValidation 实现表单动态验证功能。编程之家 52php.cn 收集整理的教程希望能对你有所帮助,如果觉得编程之家不错,可分享给好友!感谢支持。

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读