无法验证日期条目

时间:2017-07-05 21:55:14

标签: javascript validation

需要验证用户输入的日期不是2014年之前或当前日期之后。我尝试将日期条目拆分为" /"然后使用parseInt来检查[2]点是否小于2014,但它似乎没有效果!



<!DOCTYPE HTML>

<html>
<head>
<style>

form {border-style: inset;
	border-color: blue;
	height: 360px;
	width: 775px;
	margin: auto;
}
	
</style>

<script>
//Declares 3 arrays
var fullNames = new Array(100);
var dates = new Array(100);
var opinions = new Array(100);

//Global variable
var numOfRatings = 0;
</script>

<script>
//Validates fields are not empty, date is correct then assigns data to arrays
function validateData()
{
	var fullNameStr = document.getElementById("FullName").value;
	var dateStr = document.getElementById("Date").value;
	var opinionStr = document.getElementById("opinion").value;
	
	if (!fullNameStr||!opinionStr||!dateStr) {
		alert("Please complete all fields.");
	  return;
	  }
	else {
	
	var dateVal = dateStr;
	var dateParts = dateVal.split("/");
	
	if (parseInt(dateParts[2]) < "2014") {
			alert("Invalid date!");
			}
		else {
			fullNames[numOfRatings] = fullNameStr;
			dates[numOfRatings] = dateStr;
			opinions[numOfRatings] = opinionStr;
			numOfRatings++;
			document.getElementById("FullName").value = "";
			document.getElementById("Date").value = "";
			document.getElementById("opinion").value = "";
		}
	}
}		
</script>


<script>
//Displays data held in arrays
function displayData()
{
	var col;
	var pos;
	
	document.getElementById("list").value = "FULL NAME                 DATE            RATING\n";
	
	for (pos = 0; pos < numOfRatings; pos++)
	{
		document.getElementById("list").value += fullNames[pos];
		for (col = fullNames[pos].length; col <= 25; col++)
			document.getElementById("list").value += " ";
		document.getElementById("list").value += dates[pos];
		for (col = dates[pos].length; col <= 15; col++)
			document.getElementById("list").value += " ";
		document.getElementById("list").value += opinions[pos]+ "\n";
	}
}
</script>

<script>
//Clears form
function clearData()
{
	var pos;
	
	for (pos = 0; pos < numOfRatings; pos++)
	{
		fullNames[pos] = "";
		dates[pos] = "";
		opinions[pos] = "";
	}
	numOfRatings = 0;
}	
</script>
</head>

<h1 style ="text-align:center; border-bottom:1px solid #999999">Internet Technologies Membership</h1>
<form name ="ratingForm">
	<table cellpadding="10">
		<td>
			<tr>
				<td>Full Name:</td>
				<td><input type="text" id="FullName" name="FullName"></td>
				<td>Date:</td>
				<td><input type="date" id="Date" name="Date"></td>
				<td>Opinion:</td>
				<td>
					<select name="opinion" id="opinion">
					  <option value="&#9733;&#9733;&#9733;&#9733;&#9733;">Excellent</option>
					  <option value="&#9733;&#9733;&#9733;&#9733;">Very Good</option>
					  <option value="&#9733;&#9733;&#9733;">Good</option>
					  <option value="&#9733;&#9733;">Fair</option>
					  <option value="&#9733;">Poor</option>
					  <option value="0">Very Bad</option>
					</select>
				</td>
			</tr>
	</table>
<br>
<center>
	<textarea name="list" id="list" rows="10" cols="100">
	</textarea>
	<br>
	<br>
	<input type="button" value="RATE" onClick="validateData();">
	<input type="button" value="DISPLAY" onClick="displayData();">
	<input type="reset" value="CLEAR" onClick="clearData();">
<br>
</center>
</form>
</html>
&#13;
&#13;
&#13;

2 个答案:

答案 0 :(得分:0)

if (parseInt(dateParts[2]) < "2014") {

上面的代码部分是用字符串检查dateParts [2](一个Int)。

你必须制作&#34; 2014&#34;部分也是整数。

所以上面的行应该是

if (parseInt(dateParts[2]) < 2014) {

此外,我建议将MomentJS用于任何与DateTime相关的功能。

答案 1 :(得分:0)

无论输入框中显示的是什么,都将以YYYY-MM-DD格式检索日期。 尝试用连字符( - )分割它。

同时比较使用2014作为数字而不是字符串

var dateParts = dateVal.split("-");
if (parseInt(dateParts[0]) < 2014)