JavaScript program to validate a date

Write a JavaScript program to validate a date in dd/mm/yyyy format

Solution

<!DOCTYPE HTML>
<html>
	<head>
		<title>Date Validation</title>
		<script type="text/javascript" src="data.js"></script>
		<style type="text/css">
		.error_msg
		{
			color:#ff0000;
			font-style:italic;
		}
		.result
		{
			color:#00ff00;
			font-size:20px;
		}
		</style>
		<script language="javascript">
		function validate_date()
		{
			var chkdate = document.getElementById("dob").value
			document.getElementById("error_msg_spn").innerHTML="";
			document.getElementById("result_spn").innerHTML="";
			if(document.getElementById("dob").value == "")
			{
				document.getElementById("error_msg_spn").innerHTML="Please enter the Date";
				document.getElementById("dob").focus();
			}
			else if(!chkdate.match(/^(0[1-9]|[12][0-9]|3[01])[\/]((0[1-9]|1[012])[\/](19|20)[0-9]{2})$/))
			{
				document.getElementById("error_msg_spn").innerHTML="Date format is wrong";
				document.getElementById("dob").focus();
			}
			else
			{
				document.getElementById("result_spn").innerHTML="This is Valid Date";
			}
		}
		</script>
	</head>
	<body onload="get_cur_time()">	

		<h4>Result:</h4>
		<form name="frm" id="frm">	
			<div>
				<label for="dob">Enter the Date</label>
				<input type="text" name="dob" id="dob" placeholder="DD/MM/YYYY"/>
				<span id="error_msg_spn" class="error_msg">*</span>
			</div>
			<div>
				<input type="button" name="check_btn" id="check_btn" value="validate" onclick="validate_date()"/>
			</div>
			<div>
				<span id="result_spn" class="result"></span>
			</div>
		</form>
	</body>
</html>

Output

Programming Examples

JavaScript program to validate a date