Javascript Date Validation DD MM YYYY Age Checking

Question

I ve started to work on Javascript recently  What I am testing is checking the DoB in valid format  Next step will be checking the age    What my HTML code includes is below   lt form name  ProcessInfo  action     method  POST  enctype  multipart form-data  target   self  onsubmit  return checkForm     gt           lt br gt   lt label for  txtDOB  gt Date of Birth    lt  label gt   lt input id  txtDOB  type  text  name  txtDOB  size  12  gt  format              lt br gt         lt  form gt        and I did the following in my  js file  var errMessage        function checkForm         validateName        validateSurname        carSelect        validateDOB         if  errMessage                else           alert errMessage                 function validateDOB         var dob   document forms  ProcessInfo    txtDOB   value      var pattern       0-9  2  -  0-9  2  -  0-9  4          if  dob    null    dob           pattern test dob             errMessage     Invalid date of birth n           return false            else           return true           I tried to check if its valid with regular expression but I always get an alert even if I type the date correctly  And how can I seperate the DD   MM   YYYY to calculate the age

User · Answer

I suggest using moment js which provides an easy to use method for doing this   interactive demo  function validate date       var eighteenYearsAgo   moment   subtract 18   years        var birthday   moment date        if   birthday isValid              return  invalid date                 else if  eighteenYearsAgo isAfter birthday             return  okay  you re good                 else           return  sorry  no                 To include moment in your page  you can use CDNJS    lt script src    cdnjs cloudflare com ajax libs moment js 2 4 0 moment min js  gt  lt  script gt

User · Answer

When we put only pattern it s not simple to check every possible date combination  Users can enter valid numbers like 99 99 9999 but it s not a valid date  Even If we limit days and months to a more restrictive value  30 31 days and 0-12 months  we still may get a case where we have leap year  febraury etc  and we cannot properly validate them using regex  So the better approach is to use a date object itself   x000D   x000D  let InputDate    99 99 9999  let pattern      0-9  2      0-9  2      0-9  4      let editDate   InputDate replace       -    let dateValidation   function validation       if pattern test InputDate   amp  amp  new Date editDate      Invalid Date      return false   else    return true        console log dateValidation      Return false x000D   x000D   x000D

User · Answer

with leading zero for day and month  var pattern     0 1-9  1 0-9  2 0-9  3 0-1     0 1-9  1 0-2      0-9  4        and with both leading zero without leading zero for day and month  var pattern     0  1-9  1 0-9  2 0-9  3 0-1     0  1-9  1 0-2      0-9  4

User · Answer

if     0  1-9   12  0-9  3 01      -  0  1-9  1 012      -  d 2    test   this  val                           alert  Date format incorrect  DD MM YY                            this  datepicker  setDate                             return false                      This code will validate date format DD MM YY

User · Answer

To get the values use pattern exec   instead of pattern test    the  test   returns a boolean value

User · Answer

If you want to use forward slashes in the format  the you need to escape with back slashes in the regex    x000D   x000D      x000D  var dateformat      0  1-9  1 012      -  0  1-9   12  0-9  3 01      -  d 4     x000D   x000D   x000D

User · Answer

You can use attributes of html tag instead of validation from html input type   date  can be used instead of validating it  That s the benifits html 5 gives you

User · Answer

You have used regular expression for this format   DD - MM- YYYY  If you need this format DD MM YYYY use   var pattern      0-9  2      0-9  2      0-9  4

User · Answer

var date    0-9  1 2  - 0-9  1 2  - 0-9  1 4      if  date test form date value    alert  Enter correct date     else alert   working

User · Answer

If you want to use forward slashes in the format  the you need to escape with back slashes in the regex   var pattern      0-9  2      0-9  2      0-9  4        http   jsfiddle net P9TER

User · Answer

It is two problems - is the slashes the right places and is it a valid date  I would suggest you catch input changes and put the slashes in yourself   annoying for the user   The interesting problem is whether they put in a valid date and I would suggest exploiting how flexible js is    x000D   x000D  function isValidDate str    x000D    var newdate   new Date    x000D    var yyyy   2000   Number str substr 4  2    x000D    var mm   Number str substr 2  2   - 1  x000D    var dd   Number str substr 0  2    x000D    newdate setFullYear yyyy   x000D    newdate setMonth mm   x000D    newdate setDate dd   x000D    return dd    newdate getDate    amp  amp  mm    newdate getMonth    amp  amp  yyyy    newdate getFullYear    x000D    x000D  console log isValidDate  jk      false x000D  console log isValidDate  290215      false x000D  console log isValidDate  290216      true x000D  console log isValidDate  292216      false x000D   x000D   x000D

User · Answer

I use the code I found   w3resources The code takes care of  month being less than 12   days being less than 32  even works with leap years  While Using in my project for leap year I modify the code like if   lyear  false   amp  amp   dd gt  29     alert  Invalid date format     return false    if   lyear  false   amp  amp   dd gt  29     alert  not a Leap year February cannot have more than 28days    return false      Rather than throwing the generic  quot Invalid date format quot  error which does not make much sense to the user  I modify the rest of the code to provide valid error message like month cannot be more than 12  days cannot be more than 31 etc   The problem with using Regular expression is it is difficult to identify exactly what went wrong  It either gives a True or a false-Without any reason why it failed  We have to write multiple regular expressions to sort this problem

User · Answer

If you re using moment then that s the single line code   moment date  format  DD MM YYYY   isValid

User · Answer

I d utilize the built in Date object to do the validation for me  Even after you switch from - to   you still need to check whether the month is between 0 and 12  the date is between 0 and 31 and the year between 1900 and 2013 for example   function validateDOB         var dob   document forms  ProcessInfo    txtDOB   value      var data   dob split              using ISO 8601 Date String     if  isNaN Date parse data 2     -    data 1     -    data 0               return false             return true      See https   developer mozilla org en-US docs Web JavaScript Reference Global Objects Date parse Example  Using parse for more information

User · Answer

lt  DOCTYPE html gt   lt html xmlns  http   www w3 org 1999 xhtml  gt   lt head gt   lt title gt  lt  title gt   lt script gt      function dateCheck             debugger           var inputValues   document getElementById  dateInput   value         document getElementById  monthInput   value         document getElementById  yearInput   value           var d   new Date            var n   d getHours            var m   d getMinutes            var p   d getSeconds             var date   document getElementById  dateInput   value          var month   document getElementById  monthInput   value          var year   document getElementById  yearInput   value           var dateCheck      0  1-9   12  0-9  3 01              var monthCheck      0 1-9  1 0-2              var yearCheck      d 4               if  month match monthCheck   amp  amp  date match dateCheck   amp  amp  year match yearCheck                  var ListofDays    31  28  31  30  31  30  31  31  30  31  30  31                if  month    1    month  gt  2                    if  date  gt  ListofDays month - 1                         alert  Invalid date format                         return false                                               if  month    2                    var leapYear   false                  if     year   4   amp  amp  year   100       year   400                         leapYear   true                                     if   leapYear    false   amp  amp   date  gt   29                         alert  Invalid date format                         return false                                     if   leapYear    true   amp  amp   date  gt  29                         alert  Invalid date format                         return false                                               var flag   1                    else               alert  invalid date                        if  flag    1                alert  the date is     inputValues          The time is     n         m         p                      clear               function clear             document myForm dateInput value               document myForm monthInput value               document myForm yearInput value                lt  script gt    lt  head gt     lt body gt         lt div gt             lt form name  myForm  action     gt                  lt table gt                   lt tr gt                       lt td gt Enter Date lt  td gt                       lt td gt  lt input type  text  name  dateInput  id  dateInput  placeholder  Date   maxlength  2  onclick  dateCheck document myForm dateInput   onkeypress  return event charCode     0      d  test String fromCharCode event charCode      gt  lt  td gt                       lt td gt  lt span id  span1  gt  lt  span gt  lt  td gt                   lt  tr gt                   lt tr gt                       lt td gt Enter Month lt  td gt                       lt td gt  lt input type  text  name  monthInput  id  monthInput  placeholder  Month   maxlength  2  onclick  dateCheck document myForm dateInput   onkeypress  return event charCode     0      d  test String fromCharCode event charCode      gt  lt  td gt                       lt td gt  lt span id  span2  gt  lt  span gt  lt  td gt                   lt  tr gt                   lt tr gt                       lt td gt Enter Year lt  td gt                       lt td gt  lt input type  text  name  yearInput  id  yearInput  placeholder  Year  minlength  4  maxlength  4  onclick  dateCheck    onkeypress  return event charCode     0      d  test String fromCharCode event charCode      gt  lt  td gt                       lt td gt  lt span id  span3  gt  lt  span gt  lt  td gt                   lt  tr gt                    lt tr gt                       lt td gt  lt  td gt                       lt td gt  lt input type  submit  name  submit  value  Submit  onclick  dateCheck     gt  lt  td gt                   lt  tr gt               lt  table gt           lt  form gt         lt  div gt      lt  body gt     lt  html gt   lt td gt

User · Answer

Using pattern and check validate    var input    33 15 2000    var pattern       0 1-9   12  0-9  3 01       0 13578  1 02      0 1-9   12  0-9       02     0 1-9   12  0-9  3 0       0 469  11       d 4      alert pattern test input

[javascript] Javascript Date Validation ( DD/MM/YYYY) & Age Checking

interactive demo

Examples related to javascript

Examples related to html

Examples related to validation