AngularJS: How to validate date in US format?

Question

I have the following form code that allows input of a date using AngularUI (date is required and should match US date format e.g.: MM/DD/YY):

<form name="form" ng-submit="createShipment()">
    <!-- Shipment Date must be in MM/DD/YY format: -->  
    <input name="shipmentDate" 
          ng-pattern='/^[0,1]?\d{1}\/(([0-2]?\d{1})|([3][0,1]{1}))\/(([1]{1}[9]{1}[9]{1}\d{1})|([2-9]{1}\d{3}))$/'
          ui-date="{ dateFormat: 'mm/dd/y' }" required ng-model="shipment.ShipmentDate" type="text">
    <span ng-show="form.shipmentDate.$error.required">Date Required!</span>
    <span ng-show="form.shipmentDate.$error.pattern">Incorrect Format, should be MM/DD/YY!</span>

    <input class="btn-primary" ng-hide="!form.$valid" type="submit" value="Create">
</form>

Validation for required field works fine, but date format is not being validated correctly and always shows 'Incorrect Format...' message.

I tried several different Regular Expressions that worked fine elsewhere, but it is still not working. Also I tried AngularUI validation and it doesn't work either. Thanks in advance!

UPDATE:

I figured that validation was conflicting with AngularUI datepicker I used, but datepicker autocorrects date anyway, so if datepicker is not used, than validation works as long as regular expression works, and if datepicker is used, there is not much need for other validation.

ng-pattern? Is this your own implementation? Or from angular-ui? — asgoth, Jan 03 '13 at 20:44
ng-pattern is part of Angular, but not well known. See http://docs.angularjs.org/cookbook/form for an example. It is also mentioned on the "input" API pages, e.g., http://docs.angularjs.org/api/ng.directive:input — Mark Rajcok, Jan 04 '13 at 03:13

Mark Rajcok · Answer 1 · 2016-05-18T20:59:30.183

20

Your ng-pattern worked in a fiddle I created, but it allows for some incorrect dates, such as 0/9/1993 and 19/2/1993.

Here's a better pattern: (note, it was updated to match @WillSadler's answer)

^(0?[1-9]|1[012])\/(0?[1-9]|[12][0-9]|3[01])\/((19\d{2})|([2-9]\d{3}))$

Fiddle.

edited May 18 '16 at 20:59

answered Jan 04 '13 at 03:51

Mark Rajcok

362,217
114
495
492

I believe the pattern above needs a slight tweek - an additional () around the year part so that it becomes: /^(0?[1-9]|1[012])\/(0?[1-9]|[12][0-9]|3[01])\/((199\d)|([2-9]\d{3}))$/ – Rob Bygrave Feb 21 '13 at 14:32
@Rob, the pattern worked (because the alternation at the end doesn't have to be enclosed in parenthesis), but I do see your point, so I made the pattern more consistent -- the alternate year patterns are now enclosed in one set of parenthesis like the the month and day. – Mark Rajcok Feb 21 '13 at 16:11
There is form.$invalid, just sayin – eomeroff Dec 09 '13 at 08:24
4

**Warning: This regex does not allow dates before 1/1/1990.** That might be fine for the OP but not for a general use case. Good answer, I just think the question is misleading. – Keith Sep 26 '14 at 19:16
Thanks @Keith, updated to match WillSadler's answer. – Mark Rajcok May 18 '16 at 21:00

score 2 · Accepted Answer · answered Jan 26 '16 at 21:19

2

The accepted answer doesn't work for me. I changed to:

^(0?[1-9]|1[012])\/(0?[1-9]|[12][0-9]|3[01])\/((19\d{2})|([2-9]\d{3}))$

Otherwise only people born after 1990 need apply!

answered Jan 26 '16 at 21:19

Will Sadler

144
1
3

Ahosan Karim Asik · Answer 3 · 2015-06-23T20:27:48.307

-1

Check with leap year validate: Date format:dd-mm-yyyy

Regex pattern: ^(0?[1-9]|1\d|2[0-8]|29(?=[-]\d?\d[-](?!1[01345789]00|2[1235679]00)\d\d(?:[02468][048]|[13579][26]))|30(?![-]0?2)|31(?=[-]0?[13578]|[-]1[02]))[-](0?[1-9]|1[0-2])[-]([12]\d{3})$

Demo

another demo

edited Jun 23 '15 at 20:27

answered Jun 23 '15 at 20:14

Ahosan Karim Asik

3,219
1
18
27

CAREFULL ! This pattern does not work. No dates after the 28th are accepted. Try for instance the 29/03/1963. https://regex101.com/r/bO6rY5/1 – i.am.michiel Nov 02 '15 at 10:51

AngularJS: How to validate date in US format?

3 Answers3

Linked