Why bother with complexities when there are already libraries that mask date formats, right? The JQuery Input Mask library does the trick easily.
I do not like to use HTML 5’s Date input type field because you still would have to create a function to limit the number of characters for the year. There is no attribute in this HTML element to define the max length. It just does not work.
So rather than bother with hassles, this JQuery library does the trick easily. This is how the HTML input field will look like.
If you noticed, the reason I used a bind on the keyup function is because the JQuery Input Mask library messes the backspace and delete key result if I wanted to use scope.$parsers to detect any input. Binding the keyup did the trick.
Sad to say, there is no such control in Java FX 2. However, Java FX 8 has one. Then again, if you want to maintain your rule that you must never force the user to update to the latest version just to be able to see a date picker, the only option is to make one.
Luckily, somebody else did the dirty work for us. Marko Jacob extended a more flexible version from Christian Schudt and it works flawlessly. Plus, using it is fairly easy too.
The downside to this is that you cannot import this control in the Java FX Scene Builder. You will have to add the DatePicker control programmatically.
Download his JavaFX Date Picker Release on GitHub.