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 ...
随机推荐
- [leetcode] Path sum路径之和
要求给定树,与路径和,判断是否存在从跟到叶子之和为给定值的路径.比如下图中,给定路径之和为22,存在路径<5,4,11,2>,因此返回true;否则返回false. 5 / \ 4 8 / ...
- !!无须定义配置文件中的每个变量的读写操作,以下代码遍历界面中各个c#控件,自动记录其文本,作为配置文件保存
namespace PluginLib{ /// <summary> /// 遍历控件所有子控件并初始化或保存其值 /// </summary> pub ...
- grunt + compass retina sprites
https://github.com/AdamBrodzinski/Retina-Sprites-for-Compass
- 1109. Conference(二分图)
1109 二分图的模板题 不过这题题意 我纠结了好久 不知道是不是我对二分图不熟悉的原因 这题就是说 有n+m个人参加会议 要在这n+m中进行通话 求最少的连接数 就是每个人都得被连接上 这样求最大匹 ...
- 最大流 Dinic + Sap 模板
不说别的,直接上模板. Dinic+当前弧优化: struct Edge{ int x,y,c,ne; }e[M*]; int be[N],all; int d[N],q[N]; int stack[ ...
- Codeforces 4538 (状态压缩dp)Little Pony and Harmony Chest
Little Pony and Harmony Chest 经典状态压缩dp #include <cstdio> #include <cstring> #include < ...
- 函数buf_LRU_old_adjust_len
调整LUR_old位置,放到八分之五位置,是新的,后八分之三是旧的 512个页全变成新的,然后从后往前数,数到8分之3,设置为旧的 /********************************* ...
- UVa 10868 (物理) Bungee Jumping
题意: 有个人在蹦极,给出悬崖的高度,绳子的长度,弹簧绳的胡克系数 以及 人的质量. 判断人是否能够着地,能的话是否能安全着地.所谓安全着地就是到达地面的速度不超过10m/s. 分析: 学过一点高中物 ...
- 【转】JAVA之网络编程
转自:火之光 网络编程 网络编程对于很多的初学者来说,都是很向往的一种编程技能,但是很多的初学者却因为很长一段时间无法进入网络编程的大门而放弃了对于该部分技术的学习. 在 学习网络编程以前,很多初学者 ...
- LeetCode Binary Tree Level Order Traversal II (二叉树颠倒层序)
题意:从左到右统计将同一层的值放在同一个容器vector中,要求上下颠倒,左右不颠倒. 思路:广搜逐层添加进来,最后再反转. /** * Definition for a binary tree no ...