词条统计
浏览次数:7934 次
编辑次数:1次 历史版本
最近更新:2013/6/20
创建者:掷鸡蛋者


现在我们增加一个需求,要求标题框至少输入5个字符,但不能多于15个字符。我们需要修改一下验证控件:

我们给验证控件添加了一个属性rule,这个属性的值是正则表达式,表示5-15个字符之间的匹配。
有一点要注意,写js写习惯了程序员,可能会习惯性的给这段表示正则表达式的字符的首尾加上斜杠“/”——这是不需要的:

提醒:请勿在rule属性值的开头和结尾添加斜杠“/”

wojilu ajax framework为了开发的方便,预置了13种验证规则,分别是:


规则名称说明
name英文开头,可数字、下划线,3-20个字符
name_cn可中英文,长度2-19
password任意字母,4-20个字符
password2任意字母,4-20个字符;和前一个password类型字段一致
same判断当前控件的值是否和属性target指定的控件的值一致
int正整数,至多15位
email 
tel 
mobile 
url 
money 
zip 
qq 


可以把上面的规则名称直接赋值给rule属性,比如填写email:

<span class="valid" msg="请填写标题" rule="email"></span>

就不用自己手写email的正则表达式了。

除了直接显示错误信息,wojilu 验证框架还提供了另外一种提醒方式:

就是一旦输入有误,被验证的输入框的边框自动高亮显示,但不出现文字提醒。这在数据密集型表单中比较有用,这种密集型表单,本来文字和输入控件就一大堆,格式也有严格规定,如果再出现一堆错误提醒信息,就变得非常多余、干扰界面效果。使用“边框高亮”模式进行错误提示,比较简洁和醒目。做法是再添加一个属性mode:

属性的值必须是border这个字符串。

【总结一下验证控件的语法】

<span class="validto="name" type="select" rule="email" msg="请填写用户名" mode="border" show="true" ajaxAction="url"></span>

 

ajax动态验证

以上的验证纯粹在客户端进行。但有时候需要动态查询服务器,比如通过服务器端查询用户名是否存在,才能判断是否验证通过。这时候您只要给验证控件再添加一个属性 ajaxAction即可。这个属性的值是一个网址url。wojilu ajax framework会将被验证对象的值作为参数post到此url

为了配合ajax动态验证,您必须在服务器端的这个url上实现验证方法,返回一段是否有效或无效的json对象。