jsViews validates(验证)
概述:jsViews使得前端开发过程将js代码与html分离,通过模板实现数据与html元素关联,通过绑定方法用数据填充模板,达到渲染html要素的目的。采用该方法后js文件中再也不会出现动态创建html标签的代码,而导致修改页面元素时必须修改js代码的问题,关于jsViews的具体内容可参考其官网http://www.jsviews.com/,本文仅涉及前端页面通过jsViews进行验证时的操作。
jsViews验证包含两种情况——简单情况和自定义扩展,对于简单的验证如输入字符长度、必填字段等,可直接在模板文件中添加{^{validate}}{{/validate}}标签实现,如:
<div class="form-group"> <label class=" control-label col-sm-4">单位名称</label> <div class="col-sm-8"> <input type="text" class="form-control" data-link="{validate ORGNAME minLength=2 msg_minLength='单位名称不能少于%cond%字符' }" /> </div> </div> |
当然简单的配置属性不能完全满足具体开发过程中的复杂情况,此时,jsviews提供了接口允许开发者对验证的规则进行扩展,扩展的规则中可调用自己编写的验证函数,完成扩展后便可直接在模板文件中像引用其它验证标签一样直接引用扩展的标签,模板绑定后会自动调用自定义的验证标签完成验证。下面请看如何对验证规则进行扩展。
/* * 为jsviews添加额外的验证规则 */ // Register additional validators for orgcode $.views.tags.validate.validators({ //格式验证 regex_orgcode: { message: "请输入符合要求的组织结构代码", test: function (condition, val) { var reg = new RegExp("^(([0-9]{8}\-[A-Z0-9]{1})|([A-Z0-9]{2}[0-9]{6}[A-Z0-9]{10}))$"); return !reg.test(val); } }, //唯一性验证 unique: { message: "您输入的组织结构代码已存在", test: function (condition, val) { var res = model.customer.org_code_unique(val); return res; } } }); |
在模板文件中引用自定义标签
<div class="form-group"> <label class=" control-label col-sm-4">组织机构代码</label> <div class="col-sm-8"> {^{validate ORGCODE required=true msg_required='请输入组织结构代码' regex_orgcode=true unique=true }} <input type="text" class="form-control" data-link="ORGCODE" /> {{/validate}} </div> </div> |
至此,如何用jsViews进行验证已经结束。
jsViews validates(验证)的更多相关文章
- Ruby on Rails 的模型 validates 验证
validate(), 这个方法在每次保存数据时都会被调用.如:def validate if name.blank? && email.blank? errors.add_to_b ...
- 【微信小程序项目实践总结】30分钟从陌生到熟悉
前言 我们之前对小程序做了基本学习: 1. 微信小程序开发07-列表页面怎么做 2. 微信小程序开发06-一个业务页面的完成 3. 微信小程序开发05-日历组件的实现 4. 微信小程序开发04-打造自 ...
- 微信小程序开发06-一个业务页面的完成
前言 接上文:微信小程序开发05-日历组件的实现 github地址:https://github.com/yexiaochai/wxdemo 这里来说一说我们的理念,我们也学习小程序开发有一周多了,从 ...
- 【微信小程序项目实践总结】30分钟从陌生到熟悉 web app 、native app、hybrid app比较 30分钟ES6从陌生到熟悉 【原创】浅谈内存泄露 HTML5 五子棋 - JS/Canvas 游戏 meta 详解,html5 meta 标签日常设置 C#中回滚TransactionScope的使用方法和原理
[微信小程序项目实践总结]30分钟从陌生到熟悉 前言 我们之前对小程序做了基本学习: 1. 微信小程序开发07-列表页面怎么做 2. 微信小程序开发06-一个业务页面的完成 3. 微信小程序开发05- ...
- rails 常用的验证方法 validates (转)
Agile Web Development with Rails 17.4 validation validate 在save的时候激活validate_on_create ...
- Yii2 rules验证规则
Rules验证规则: required : 必须值验证属性||CRequiredValidator 的别名, 确保了特性不为空. [['字段名1','字段名2'],required] //字段 ...
- ruby on rails validates uniqueness
最近在处理一个小功能,每个元素可以有多个图片,每个图片的name表示了它是背景图还是海报图, 需要对每个元素的图片name做一个唯一性验证,一个元素不能添加两个海报图, 需要使用的是validates ...
- [ruby on rails] 跟我学之(10)数据输入验证
这里简单加上几个验证,非空,最小长度,唯一 修改模型 修改app/models/post.rb文件,如下: class Post < ActiveRecord::Base #attr_acces ...
- 【ASP.NET Web API教程】6.4 模型验证
本文是Web API系列教程的第6.4小节 6.4 Model Validation 6.4 模型验证 摘自:http://www.asp.net/web-api/overview/formats-a ...
随机推荐
- VIM Taglist + ctags
Windows下 进入http://ctags.sourceforge.net/ 下载ctags 把ctags58.zip解压,随便放个地方,我放到了Home\Vim\vim72下,在ctags58文 ...
- Android Studio 初探
前言 上周由于写了一篇关于"Eclipse+ADT+Android SDK 搭建安卓开发环境" 的博文,其他博主们表示相当的不悦,都什么年代了还用Eclipse+ADT开发安卓应用 ...
- linux 查看某一端口的占用情况
查看某一端口的占用情况: lsof -i:端口号,例如查看端口21是否被占用 lsof -i: 实例:查看端口是否被占用,如果被占用结束掉该端口 [root@localhost splunk]# ls ...
- NC / Netcat - 反弹Shell
原理 实验环境: 攻击机:windows机器,IP:192.168.12.109 受害机:linux机器,IP:192.168.79.1 攻击机:设置本地监听端口2222 C:\netcat>n ...
- PCL—低层次视觉—点云分割(RanSaC)
点云分割 点云分割可谓点云处理的精髓,也是三维图像相对二维图像最大优势的体现.不过多插一句,自Niloy J Mitra教授的Global contrast based salient region ...
- BNU OJ 33691 / LA 4817 Calculator JAVA大数
留着当个模板用,在BNU上AC,在LA上RE……可能是java的提交方式不同??? 数和运算符各开一个栈. 表达式从左到右扫一遍,将数存成大数,遇到数压在 数的栈,运算符压在 运算符的栈,每当遇到右括 ...
- maven小项目注册服务(三)--web模块
java的web应用打包方式一般为war它和jar的区别就是包含了更多的资源和文件,如JSP文件,静态资源文件,servlet等等.war包的核心就WEB-INF文件夹下必须有一个web.xml 的配 ...
- sublime安装插件
今天因为某些原因,把 sublime 卸载掉了,然后来安装的时候,发现 Package Control 无法安装了,或者安装好后运行 ctrl + shift + p,会报 错误,截图如下: 然后就 ...
- ti processor sdk linux am335x evm /bin/commom.sh hacking
#!/bin/sh # # ti processor sdk linux am335x evm /bin/commom.sh hacking # 说明: # 本文主要对TI的sdk中的common.s ...
- Web API入门指南(安全)转
安全检测的工具站点:https://www.owasp.org/index.php/Category:Vulnerability_Scanning_Tools Web API入门指南有些朋友回复问了些 ...