一、下载与导入
下载:
http://cosoft.org.cn/projects/jsvalidation(目前似乎无法访问),建议搜索下去其他下载站点下载。
解压下载的压缩包,其中validation-framework.js,validation-config.xml,validation-config.dtd,这3个文件是我们需要的。
导入js库:
<script src="/Example4/js/validation-framework.js"></script>
validation-config.xml:验证规则的配置,项目中验证模块的工作主要就是在此文件中配置规则。
validation-framework.js:对validation-config.xml文件解析,实现验证函数。
validation-config.dtd:文档类型定义文件,是对validation-config.xml文件格式的规定,不需要改动。
二、使用步骤
1.绘制登录页
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script src="/Example4/js/validation-framework.js"></script>
</head>
<body>
<form method="post" action="/Example4/f" id="form1" onsubmit="return doValidate(this)">
用户名:<input type="text" name="userName" id="userName" /><span id="nameSpan"></span><br><br>
密码:<input type="password" name="password" id="password" /><span id="passSpan"></span><br><br>
<input type="submit" value="登录" /><input type="reset" value="重置" />
<div id="error" style="color:red;font-weight:bold"></div>
</form>
</body>
</html>
2.改写validation-config.xml
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE validation-config SYSTEM "validation-config.dtd">
<validation-config lang="auto">
<form id="form1" show-error="error" show-type="all">
<field name="userName" display-name="用户名" onfail="">
<depend name="required" />
<depend name="commonChar" />
</field>
<field name="password" display-name="密码">
<depend name="required" />
<depend name="commonChar" />
</field>
</form>
</validation-config>
3.服务器运行
出现乱码问题:
用Editplus保存为UTF-8
如下:
再次运行:
属性:
form元素属性
id:映射网页表单id
show-error:默认alert弹窗,可用div显示错误,参数值就是该div的id值
show-type:all全部错误
field
name:表单域的名称
display-name:表单域显示名称
onfail:尚未实现的功能
depend标记
required必须的,代表不能为空
Integer允许为空 || 是整数
Double允许为空 || 是double型
commonChar普通英文字符、数字和下画线