概述: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(验证)的更多相关文章

  1. Ruby on Rails 的模型 validates 验证

    validate(), 这个方法在每次保存数据时都会被调用.如:def validate if name.blank? && email.blank?  errors.add_to_b ...

  2. 【微信小程序项目实践总结】30分钟从陌生到熟悉

    前言 我们之前对小程序做了基本学习: 1. 微信小程序开发07-列表页面怎么做 2. 微信小程序开发06-一个业务页面的完成 3. 微信小程序开发05-日历组件的实现 4. 微信小程序开发04-打造自 ...

  3. 微信小程序开发06-一个业务页面的完成

    前言 接上文:微信小程序开发05-日历组件的实现 github地址:https://github.com/yexiaochai/wxdemo 这里来说一说我们的理念,我们也学习小程序开发有一周多了,从 ...

  4. 【微信小程序项目实践总结】30分钟从陌生到熟悉 web app 、native app、hybrid app比较 30分钟ES6从陌生到熟悉 【原创】浅谈内存泄露 HTML5 五子棋 - JS/Canvas 游戏 meta 详解,html5 meta 标签日常设置 C#中回滚TransactionScope的使用方法和原理

    [微信小程序项目实践总结]30分钟从陌生到熟悉 前言 我们之前对小程序做了基本学习: 1. 微信小程序开发07-列表页面怎么做 2. 微信小程序开发06-一个业务页面的完成 3. 微信小程序开发05- ...

  5. rails 常用的验证方法 validates (转)

    Agile Web Development with Rails 17.4 validation validate              在save的时候激活validate_on_create  ...

  6. Yii2 rules验证规则

    Rules验证规则:  required : 必须值验证属性||CRequiredValidator 的别名, 确保了特性不为空. [['字段名1','字段名2'],required]    //字段 ...

  7. ruby on rails validates uniqueness

    最近在处理一个小功能,每个元素可以有多个图片,每个图片的name表示了它是背景图还是海报图, 需要对每个元素的图片name做一个唯一性验证,一个元素不能添加两个海报图, 需要使用的是validates ...

  8. [ruby on rails] 跟我学之(10)数据输入验证

    这里简单加上几个验证,非空,最小长度,唯一 修改模型 修改app/models/post.rb文件,如下: class Post < ActiveRecord::Base #attr_acces ...

  9. 【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 ...

随机推荐

  1. linux下手动安装apache详解

    引自:http://blog.chinaunix.net/uid-28458801-id-4211258.html error1:出现以下错误时候,需要下载安装apr configure: error ...

  2. 浏览器 怪异模式(Quirks Mode) 与 标准模式(Standards Mode)

    浏览器 怪异模式(Quirks Mode) 与 标准模式(Standards Mode) 怪异模式,浏览器使用自己的方式解析渲染页面,在不同的浏览器就会显示不同的样式.标准模式,浏览器使用W3C的标准 ...

  3. PHP Redis 普通封装类

    class redisInit { private $redis; //redis对象 /** * 初始化Redis * $config = array( * 'server' => '127. ...

  4. android从应用到驱动之—camera(2)---cameraHAL的实现

    本来想用这一篇博客把cameraHAL的实现和流程都给写完的.搞了半天,东西实在是太多了.这篇先写cameraHAL的基本实现框架,下一篇在具体写camerahal的流程吧. cameraHAL的实现 ...

  5. Linux命令之chmod 及+s 参数(临时以所有者权限执行)

    转自: http://blog.csdn.net/shaobingj126/article/details/7031221 chmod用于改变文件或目录的访问权限.用户用它控制文件或目录的访问权限.该 ...

  6. JAVA中,不同工程间的方法调用

    可以调用, 用配置构建路径的方法:点选工程1, 点击右键, 选择 Build Path(构建路径) - > Configure Build Path...(配置构建路径...)然后在弹出的窗口中 ...

  7. STL源码中map和set中key值不能修改的实现

    前言 最近正好刚刚看完,<stl源码剖析>这本书的map和set的源码部分.但是看完之后又突然发现,之前怎么没有注意到map和set容器中key不能修改是怎么实现的.故,特此整理如下. s ...

  8. iOS开发:Swift多线程GCD的使用

    除了上一篇文章说到到NSThread线程,还有一个GCD(Grand Central Dispath),是Apple新开发的一个解决多核编程的解决方案,充分的利用CPU资源,将所有的任务,放到一个任务 ...

  9. HTML页面导出为Word

    protected void btnExport_Click(object sender, EventArgs e) { string strFileName = DateTime.Now.ToStr ...

  10. UVa 10820 (打表、欧拉函数) Send a Table

    题意: 题目背景略去,将这道题很容易转化为,给出n求,n以内的有序数对(x, y)互素的对数. 分析: 问题还可以继续转化. 根据对称性,我们可以假设x<y,当x=y时,满足条件的只有(1, 1 ...