以前用惯了JavaScript的验证,现在又学会了JQuery的验证
验证的规则:
$("#form1").validate({
errorLabelContainer: $("#form1 div.error"),
rules: {
confirm: {
required: true,
equalTo: "#newPassword"
},
newPassword:{
required:true
},
oldPassword:{
required:true
}
},
messages: {
confirm: {
required: "请填写确认密码",
equalTo: "两次输入密码不一致"
},
newPassword:{
required:"请填写新密码",
},
oldPassword:{
required:"请填写原始密码"
}
}
});
在页面中加入laber.error
<style>
label.error {
display: block;
margin-left: 1em;
width: auto;
color: red;
}
</style>
在jsp中的body中加入
<div class="error">
</div>
全部代码如下:
<%@ page language="java" contentType="text/html; charset=UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<c:set var="user" value="${sessionScope.CURRENT_USER}"/>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<link type="text/css" href="${ctx}/plugins/mobileweb/web/resources/css/bootstrap.min.css" rel="stylesheet" />
<link type="text/css" href="${ctx}/plugins/mobileweb/web/resources/css/oaCss.css" rel="stylesheet" />
<link type="text/css" href="${ctx}/plugins/mobileweb/web/resources/css/styles.css" rel="stylesheet">
<title></title>
</head>
<body>
<style>
label.error {
display: block;
margin-left: 1em;
width: auto;
color: red;
}
</style>
<div
}
}
});
});
</script>
</html>