概述: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. ios越狱开发第一次尝试记录

    1.THEOS的makefile文件中的THEOS_DEVICE_IP要写在第一行 2.如果make package install报错 dpkg status database is locked ...

  2. [51NOD]BSG白山极客挑战赛

    比赛链接:http://www.51nod.com/contest/problemList.html#!contestId=21 /* ━━━━━┒ギリギリ♂ eye! ┓┏┓┏┓┃キリキリ♂ min ...

  3. csv 文件介绍

    CSV即Comma Separate Values,这种文件格式经常用来作为不同程序之间的数据交互的格式. 具体文件格式 每条记录占一行 以逗号为分隔符 逗号前后的空格会被忽略 字段中包含有逗号,该字 ...

  4. Codeforces Round #237 (Div. 2) B. Marathon(卡long long)

    题目:http://codeforces.com/contest/404/problem/B #include <iostream> #include <cstring> #i ...

  5. ASP.NET线程相关配置

    1.(maxWorkerThreads * CPU逻辑数量)-minFreeThreads 比如2个CPU默认配置maxWorkerThreads=100,minFreeThreads=176,则同时 ...

  6. 解决hibernate向mysql插入中文乱码问题

    一.mysql的问题解决 MySQL会出现中文乱码的原因不外乎下列几点:   1.server本身设定问题,例如还停留在latin1   2.table的语系设定问题(包含character与coll ...

  7. HDU 5284 wyh2000 and a string problem(字符串,水)

    题意:比如给你一个串,要求判断wyh是不是它的子序列,那么你只需要找一个w,找一个y,再找一个h,使得w在y前面,y在h前面即可.有一天小学生拿着一个串问他“wyh是不是这个串的子序列?”.但是wyh ...

  8. Grunt + Bower—前端构建利器(转)

    目前比较流行的WEB开发的趋势是前后端分离.前端采用重量级的Javascript框架,比如Angular,Ember等,后端采用restful API的Web Service服务,通过JSON格式进行 ...

  9. git - svn 平滑到 git

    1. 建立自己的git仓库,需要是空git仓库 2. checkout 你的 git仓库 3. svn忽略.git文件,忽略.git  .gitignore 4. 把 .git文件拷到你的 svn仓库 ...

  10. erl0001-Erlang 设计原则 process port io

    Erlang原理 (转载自ITEYE cryolite博客 ps:精彩)by Robert Virding This is a description of some of the basic pro ...