Accéder au contenu principal

Date format matching regex

Regex is a must-learn for any programmer, plus it is always interesting to see how an apparently complex check can be done with a basic rule (...or how a simple check sometimes requires a long and obscure rule, but that's the whole fun of it :P).

Here's a short and useful regex to match a date field (for instance when submitting a form).

// expected field value format: YYYY-MM-DD
var e = document.getElementById("myDateField").value;
var m = e.match(/(20\d\d|19\d\d)\-(0\d|1[012])\-([012]\d|3[01])/);


Breaking it down:
/(20\d\d|19\d\d)\-(0\d|1[012])\-([012]\d|3[01])/

1. Year
(20\d\d|19\d\d)

Trying to match either "20" followed by 2 digits (2000, 2001,2002,...2099) or "19" and then 2 digits (1900...1999).
Would not match: 20a0, 201, 20AA

2. Month
(0\d|1[012])

Trying to match either "0" followed by one digit (01...09) or "1" followed by 0, 1 or 2 (hence only 10,11 or 12). We assume here that the month must be 2-digit long. Note that this would not be a problem when later parsing the date, since most systems remove "0" in front of strings/numbers.
Would not match:  4, 15, 21

3. Day
([012]\d|3[01])

Matches "0", "1" or "2" followed by one digit (04, 15, 28) or "3" followed by either 0 or 1 (30 or 31 basically).
Would not match : 8, 35
 
Note that in between each component (YYYY, MM and DD), the regex tries to match a dash (using a backslash to escape it; not necessary but I tend to escape a lot of characters :)). 

Note that not only can you validate the date format, but the regex also helps you retrieve immediately any of the components (year, month or date), since they are all captured within groups (between parenthesis).

Commentaires

Posts les plus consultés de ce blog

Lightbox effect with jQuery (3) - ready-to-use library

I've been pretty busy with work over the past days, but I managed to finalize my lightbox javascript library still. Although I can't confirm it is 100% cross-browser, it seems to be running well under IE8/9, Firefox and Chrome. I reckon it should work as well on Safari, but you never know. The actual library and a sample HTML file can be found here: https://sourceforge.net/projects/delightbox/files/ How to use ? First, include jQuery and, needless to say, the library. Second, call the function init from dlb , once the DOM has been fully created and the page is ready. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script type="text/javascript" src="./delightbox-latest.js"></script>         <script>         jQuery(document).ready(function(){             dl...

Snake game (pure JS)

Building a mini snake game in JS is one of these things every webcoder should be able to do. Since I hadn't tackled that "challenge" yet (and mostly because I was bored like hell and wanted to code something without using jQuery for a change), I decided to give it a shot. This is very basic, but it taught me a two interesting things I was unaware of: it seems that a DIV cannot natively receives the focus, but a simple workaround to cope with this is to give the DIV a tabIndex value if you duplicate an array (Array.splice(0)), references are maintained (so as far as I understand, if you modify the original array, the copy will be modified in sync...sounds pretty weird, but I must admit that there was something fishy with the values returned during my initial attempts to clone an array) Anyway, you can find the result of that one-hour experiment at the following URL: http://www.manuthommes.be/toolbox/snakejs/ Note: Left/Right arrows to turn. ...