表单验证

cmstop采用xml验证表单,这样可以顺利通过w3c验证,此验证只针对form

§   文件

public/img/js/lib/jquery.js
public/img/js/lib/cmstop.validator.js

§   规范

form元素定义name,以定位xml文件
xml
文件放在可访问的目录,确保不跨域
input,select,textarea
等需要验证的元素上定义name
如果元素的name含有“[]”这样的字符,在编写规则时去除特殊字符

§   XML规则文件

<path>/apps/app/validators/<form_name>.xml

规则文件的存储路径<path>是可指定的,默认情况下位于当前访问入口下的 apps/目录,如你现在的入口是在后台操作book应用,则默认路径为:

public/admin/apps/book/validators/

当然,这个位置是可以改变和设置的,如果不是默认路径,设置方法为:

<script type="text/javascript">
$.validate.setConfigs({
            xmlPath:newPath;
});
</script>

§   XML编写规则

根节点包括 很多字段(表单name) 字段包括很多rule(验证方法)

字段上有tipspass

rule上有eventargstextContent

<?xml version="1.0" encoding="UTF-8"?>
<root>
    <fieldName1 tips="" pass="">
        <rule1>
错误信息</rule1>
        <rule2 args="
验证参数" event="响应事件">错误事件</rule2>
    </fieldName1>
    <fieldName2 tips="" pass="">
        <rule1>
错误信息</rule1>
        <rule2 args="
验证参数" event="响应事件">错误事件</rule2>
    </fieldName2>
</root>

fieldName对应表单元素的name

tips:表单聚焦时的提示信息

pass:表单验证通过信息

event: 响应的事件 可用:blur submit change

1.响应单个事件event="blur" 多个事件 event="blur submit" (以空格分隔)
2.event=""
或者 其他未列举的值 则不响应任何事件
3.
如果 [没有给event属性] 等同于 event="blur submit"
4.event="*"
则 等同于 event="blur change submit"

args: 传递给验证方法的参数

目前regex, not, min, max, ajax 需要参数,其各自参数代表意思

<regex>args:正则表达式  eg. /regex/i, #regex#m, |regex|g 边界只允许<#|/>分隔 匹配模式只有(img)
<not>args:
不允许的值 多个不允许的值以逗号‘,’分隔
<min,max>args:
数字,顾名思义
<ajax>args:
异步验证其值 的url地址,(注:url&&amp;代替)

§   绑定到FORM

$('form').validate({
    submitHandler:function(jqform){jqform.submit()}
});

§   示例

1html表单

<form name="book_add" >
    <input type="text" name="username"/>
    <input type="password" name="passwd"/>
    <input type="radio" name="gender" value="1"/><label>
</label>
    <input type="radio" name="gender" value="2"/><label>
</label>
<form>

2、给表单绑定验证

<script type="text/javascript" src="<?=IMG_URL?>js/lib/jquery.js"></script>
<script type="text/javascript" src="<?=IMG_URL?>js/lib/cmstop.validator.js"></script>
<script type="text/javascript">
$.validate.setConfigs({
            xmlPath:apps/book/validators/
});
$('book_add').validate({
    submitHandler:function(jqform){jqform.submit()}
});
</script>

3、编写XML文件

public/admin/apps/book/validators/book_add.xml

规则内容

<?xml version="1.0" encoding="UTF-8"?>
<root>
    <username tips="
填写用户名">
        <required event="submit">
必填字段</required>
                        <min args="3">
名称不能少于3个字符</min>
        <username>
不得少于三个字符,以a-zA-Z开头 后面可以1-9a-zA-Z\-_</username>
    </username>
    <passwd tips="
填写密码">
        <password>6-20
位字符,不包含空格和$</password>
    </passwd>
    <gender>
        <required event="submit">
必选</required>
    </gender>
</root>

注意

确保访问请求和book_add.xml为同一个域下,不能跨域请求。

§   附注

内置验证规则

规则/方法

参数

说明

required

必填字段

not

不允许的值

多个不允许的值以逗号‘,’分隔 not验证

min

数字

最小长度验证

max

数字

最大长度验证

ajax

URL地址

异步验证其值 的url地址,(注:url&&amp;代替)ajax验证

regex

正则表达式

eg. /regex/i, #regex#m, 边界只允许<#,|,/>分隔 匹配模式只有(img) regex验证

email

email验证

username

username验证(a-zA-Z开头 后面是word)

password

密码长度6-20 ,不允许包含 空格 和 $

ip

IP验证,000.000.000.000格式

id

身份证号码验证 15-18

date

格式1986/12/09 1986-12-09 1986-1-8

datetime

格式(1986-12-09 11:11:11)/(1986/12/09 11:11:11)

qq

qq号码验证

mobile

手机号码

telephone

座机号码

msn

email格式

url

url格式

zipcode

不以0开头的6位数字

currency

货币格式 12.00

number

number验证 数字

english

英文字母a-zA-Z

chinese

汉字验证

integer

整数 可以-/+开头

float

浮点类型 可以-/+开头



Copyright ©2009 - 2014 CmsTop.Com.All rights reserved.
思拓合众