How to get the 'age' from input type 'date' using html & js?

Question

My question is how to get the age from the date input type using Javascript, and show it in Html.

I want the user to be able to select his Date of Birth from the Date input type, which should then be put into the 'bday' ID that I can then use to calculate the age from and fill it in the 'resultBday' element ID.

For example:
When the user selects 'January 15th, 1990' I want it to show "24 years old" in the innerHtml.

This is what I currently have:

HTML:

<p id="resultBday"></p>
<input type="date" name="bday" id="bday" onchange="submitBday()">

JS:

function submitBday () {
    var Q4A = "Your birthday is: "
    var Bday = document.getElementById('bday').value;
    Q4A += Bday;

    var theBday = document.getElementById('resultBday');
    theBday.innerHTML = Q4A;
}

Surely it's *How to get the 'age' from input type 'date' using html & js?*? I.e. the title? — Liam, Jan 24 '14 at 15:56
Take a look at this question: http://stackoverflow.com/questions/3177836/how-to-format-time-since-xxx-e-g-4-minutes-ago-similar-to-stack-exchange-site — George, Jan 24 '14 at 15:57
@Cristy - the code just shows the selected date, it doesn't calculate the age. — j08691, Jan 24 '14 at 15:58
Oh, so the question actually is "How to get age from birthdate..." — XCS, Jan 24 '14 at 15:59
Javascript Age count from Date of Birth - http://stackoverflow.com/questions/5786186/javascript-age-count-from-date-of-birth — Krish R, Jan 24 '14 at 15:59
who knows, I'm voting to close unless there is some clarification? — Liam, Jan 24 '14 at 16:00
For example, the user selects January 15th 1990, that it will then show "24 years old" in the 'resultBday'. — Kill22pro, Jan 24 '14 at 16:06

score 6 · Accepted Answer · answered Jan 24 '14 at 16:06

function submitBday() {
    var Q4A = "Your birthday is: ";
    var Bdate = document.getElementById('bday').value;
    var Bday = +new Date(Bdate);
    Q4A += Bdate + ". You are " + ~~ ((Date.now() - Bday) / (31557600000));
    var theBday = document.getElementById('resultBday');
    theBday.innerHTML = Q4A;
}

jsFiddle example

score 1 · Answer 2 · answered Jul 09 '20 at 13:40

A simple way to calculate the Year and month is as below:

HTML:

<label>Your Date of Birth <label>
<input type="date" name="birthday" id='birthday' onchange="ageCount()"> 

<p id="demo">age shows here</p>

JavaScript

<script>
  function ageCount() {
    var now =new Date();                            //getting current date
    var currentY= now.getFullYear();                //extracting year from the date
    var currentM= now.getMonth();                   //extracting month from the date
      
    var dobget =document.getElementById("birthday").value; //getting user input
    var dob= new Date(dobget);                             //formatting input as date
    var prevY= dob.getFullYear();                          //extracting year from input date
    var prevM= dob.getMonth();                             //extracting month from input date
      
    var ageY =currentY - prevY;
    var ageM =Math.abs(currentM- prevM);          //converting any negative value to positive
      
    document.getElementById('demo').innerHTML = ageY +' years ' + ageM +' months';
    }
    
    </script>

How to get the 'age' from input type 'date' using html & js?

2 Answers2

Linked