jquery.validate.js不起作用

时间:2022-12-05 19:58:07
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@page import="java.text.SimpleDateFormat"%>
<%@ taglib uri="/struts-tags" prefix="s"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">

<title>新增页面</title>

<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<link type="text/css" rel="stylesheet" media="all"
href="styles/jquery-ui-1.8.18.custom.css" />
<style type="text/css">
form.form1 label.error,label.error {
color: red;
}
</style>
<script type="text/javascript"
src="<%=request.getContextPath()%>/js/jquery-1.7.1.js">

</script>
<script type="text/javascript" src="js/jquery.validate.js"></script>
<script
src="<%=request.getContextPath()%>/js/jquery-ui-1.8.18.custom.js"></script>
<script type="text/javascript">
$(document).ready(

function() {
$('#start').datepicker(
{
dateFormat : 'yy-mm-dd', //日期格式  
yearRange : '1900:2999',//年份范围  
clearText : '清除',
closeText : '关闭',
prevText : '前一月',
nextText : '后一月',
//navigationAsDateFormat : true, 
changeMonth : true,
changeYear : true,
//currentText:'Today',
isRTL : false,
showMonthAfterYear : true,
//gotoCurrent : true,不知道怎么用,点击去当前时间
//defaultDate : +1,点击打开默认选中时间+1
dayNamesMin : [ 'Su', 'Mo', 'Tu', 'We', 'Th', 'Fr',
'Sa' ],
monthNames : [ '1月', '2月', '3月', '4月', '5月', '6月',
'7月', '8月', '9月', '10月', '11月', '12月' ],
dayNames : [ '星期天', '星期一', '星期二', '星期三', '星期四',
'星期五', '星期六' ],
onSelect : function(selectedDate) {
$("#end").datepicker("option", "minDate",
selectedDate);
}
});

$('#end').datepicker(
{
dateFormat : 'yy-mm-dd', //日期格式  
yearRange : '1900:2999',//年份范围  
clearText : '清除',
closeText : '关闭',
prevText : '前一月',
nextText : '后一月',
//navigationAsDateFormat : true, 
changeMonth : true,
changeYear : true,
//currentText:'Today',
isRTL : false,
showMonthAfterYear : true,
//gotoCurrent : true,不知道怎么用,点击去当前时间
defaultDate : +5,//点击打开默认选中时间+1
dayNamesMin : [ 'Su', 'Mo', 'Tu', 'We', 'Th', 'Fr',
'Sa' ],
monthNames : [ '1月', '2月', '3月', '4月', '5月', '6月',
'7月', '8月', '9月', '10月', '11月', '12月' ],
dayNames : [ '星期天', '星期一', '星期二', '星期三', '星期四',
'星期五', '星期六' ],
onSelect : function(selectedDate) {//与开始日期关联  
$("#start").datepicker("option", "maxDate",
selectedDate);
}
});
$("#ui-datepicker-div").css('font-size', '0.5em'); //改变大小


$("#form1").validate({ 

rules : {
name : "required",
project : {
required : true,
}
},
messages : {
name : "Name 不能为空",
project : {
required : "不能为空",
}
}
});
});
</script>
</head>

<body
style="font-size: 30px; background-image: url('images/login_bg.jpg')">
<h1 style="color: white;padding-left: 20%;">新增</h1>
<div style="padding-left: 20%;font-size: 30px;">
<s:form action="save" theme="simple" id="form1" name="form1">
<fieldset style="max-width: 200px">
<div>
<label for="project" style="color: white;font-size: 30px;">项目:</label>
<input type="text" name="timeSheet.project" id="project" 
style="width:200px;height:30px" size="30" maxlength="30" value="<s:property value='timeSheet.project'/>">
</div>
<div>
<span style="color: white;font-size: 30px;">人员:</span> <input
type="text" name="timeSheet.name" id="project" 
style="width:200px;height:30px" size="30" maxlength="30" value="<s:property value='timeSheet.name'/>">
</div>
<div>
<span style="color: white;font-size: 30px;">开始时间:</span>

<s:textfield name="timeSheet.start_date" id="start" label="开始时间"
cssStyle="width:140px;height:30px">
<s:param name="value">
<s:date name="timeSheet.start_date" format="yyyy-MM-dd" />
</s:param>
</s:textfield>
</div>
<div>
<span style="color: white;font-size: 30px;">结束时间:</span>
<s:textfield name="timeSheet.end_date" id="end" label="结束时间"
cssStyle="width:140px;height:30px">
<s:param name="value">
<s:date name="timeSheet.end_date" format="yyyy-MM-dd" />
</s:param>
</s:textfield>
</div>
<div>
<span style="color: white;font-size: 30px;">出勤天数:</span> <input
type="text" name="timeSheet.work_days" id="project"
style="width:140px;height:30px" size="30" maxlength="30" value="<s:property value='timeSheet.work_days'/>">
</div>
<div>
<span style="color: white;font-size: 30px;">加班小时:</span> <input
type="text" name="timeSheet.over_times" id="project"
style="width:140px;height:30px" size="30" maxlength="30" value="<s:property value='timeSheet.over_times'/>">
</div>
<div>
<span style="color: white;font-size: 30px;">调休天数:</span> <input
type="text" name="timeSheet.off_days" id="project"
style="width:140px;height:30px" size="30" maxlength="30" value="<s:property value='timeSheet.off_days'/>">
</div>
<div>
<span style="color: white;font-size: 30px;">请假天数:</span> <input
type="text" name="timeSheet.rest_days" id="project"
style="width:140px;height:30px" size="30" maxlength="30" value="<s:property value='timeSheet.rest_days'/>">
</div>
<div>
<span style="color: white;font-size: 30px;">备注:</span>
<textarea cols="40" id="remark" name="timeSheet.remark" rows="5" ><s:property value='timeSheet.remark'/></textarea>
</div>
<div>
<s:submit id="saveBack" name="saveBack" label="保存返回" value="保存返回"
cssStyle="" method="saveBack"></s:submit>
<s:submit id="saveContinue" name="saveContinue" label="保存继续"
value="保存继续" cssStyle="" method="saveContinue"></s:submit>
<input type="button" value="重置" onclick="javascript:window.location.href='NewTimeSheet.jsp'">
<span style="color: red;">${info}</span>
</div>
</fieldset>
</s:form>
</div>
</body>
</html>


其它内容可以忽略,主要看表单验证那块,我不知道为什么验证不了,不验证就直接提交了,然后出现空指针。我真想不到是什么原因!~

1 个解决方案

#1


用 jquery.validate.js 引入 jquery.metadata.js 后,为什么class里用json写法做验证没有效果。可以知道一些或者发个demo吗?谢谢。

#1


用 jquery.validate.js 引入 jquery.metadata.js 后,为什么class里用json写法做验证没有效果。可以知道一些或者发个demo吗?谢谢。