Massimo Scola
asked on
JavaScript and Regular Expressions - How to implement date validation?
I had this question after viewing JavaScript: Issue with onClick. I asked this question today as I had issues with making the function work in the first place.
I assume that the regular expression is correct as it should only accept dates in the 2016-12-30 format. I believed that adding a regular expression is sufficient for the date validation to work. Obviously I was wrong.
How do I make a regular expression work in JavaScript? Do I need to add an if loop with a boolean value?
I assume that the regular expression is correct as it should only accept dates in the 2016-12-30 format. I believed that adding a regular expression is sufficient for the date validation to work. Obviously I was wrong.
How do I make a regular expression work in JavaScript? Do I need to add an if loop with a boolean value?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Test</title>
</head>
<script type="application/javascript" language="javascript">
formIsOK = false;
function checkDate() {
var theExpression = /^[0-9]{4}\-(0[1-9]¦1[012])\-(0[1-9]|[12][0-9]3[01])/;
var getDate = document.getElementById("theDate");
var matchData = getDate.value.match(theExpression);
var m = getDate.value.split("-");
var theYear = m[0];
var theMonth = m[1] - 1;
var theDay = m[2];
var newDate = new Date(theYear,theMonth,theDay);
alert(newDate);
formIsOK = true;
}
</script>
<body>
<p>Date validation: </p>
<table width="200" border="1">
<tbody>
<tr>
<td>Date</td>
<td><label for="textfield">Text Field:</label>
<input type="text" name="date" id="theDate" /></td>
</tr>
<tr>
<td></td>
<td><input type="button" value="Click me" onClick="checkDate()"></td>
</tr>
</tbody>
</table>
</body>
</html>
ASKER
What I forgot to say is, that I can still add values such as 2016-99-99 ... so maybe I have an issue with the regular expression.
So how do I prevent a user from entering such a date with a regular expression?
So how do I prevent a user from entering such a date with a regular expression?
^(?:(?:31(\/|-|\.)(?:0?[13 578]|1[02] ))\1|(?:(? :29|30)(\/ |-|\.)(?:0 ?[1,3-9]|1 [0-2])\2)) (?:(?:1[6- 9]|[2-9]\d )?\d{2})$| ^(?:29(\/| -|\.)0?2\3 (?:(?:(?:1 [6-9]|[2-9 ]\d)?(?:0[ 48]|[2468] [048]|[135 79][26])|( ?:(?:16|[2 468][048]| [3579][26] )00))))$|^ (?:0?[1-9] |1\d|2[0-8 ])(\/|-|\. )(?:(?:0?[ 1-9])|(?:1 [0-2]))\4( ?:(?:1[6-9 ]|[2-9]\d) ?\d{2})$
ASKER
Hello Shaun
I'm afraid but I do not understand your code; it already took a long time to write my regular expression.
But my main other question is: How do I implement it? How do I catch the input/stop/inform the user that the date entered does not match the format yyyy-mm-dd ?
Does the regular expression work by itself just having it there?
I'm afraid but I do not understand your code; it already took a long time to write my regular expression.
But my main other question is: How do I implement it? How do I catch the input/stop/inform the user that the date entered does not match the format yyyy-mm-dd ?
Does the regular expression work by itself just having it there?
That is a regular expression to check for a valid date. See example here https://regex101.com/r/29iVIO/1
This point is that regular expressions are used for basic checking then you do validation by parsing to a date etc.
If the parse fails, it is not a valid date.
You can use this expression in "var theExpression = " is you want
This point is that regular expressions are used for basic checking then you do validation by parsing to a date etc.
If the parse fails, it is not a valid date.
You can use this expression in "var theExpression = " is you want
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Yes, you're right. It's better to go for this solution. It's easier.
Thanks for your help.
Thanks for your help.
Open in new window