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
– Liam, Commented Jan 24, 2014 at 15:56
@Cristy - the code just shows the selected date, it doesn't calculate the age. — j08691
– j08691, Commented Jan 24, 2014 at 15:58
Oh, so the question actually is "How to get age from birthdate..." — XCS
– XCS, Commented Jan 24, 2014 at 15:59

j08691 · Accepted Answer · 2014-01-24 16:06:07Z

6

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

answered Jan 24, 2014 at 16:06

j08691

209k33 gold badges269 silver badges281 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Miraz · Accepted Answer · 2020-07-09 13:40:50Z

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>

Adrian Mole · Accepted Answer · 2023-09-28 09:02:59Z

-1

get ageData(){
      const today = new Date();
      const newDate = new Date(this.dateOfBirth)
      const age = today.getFullYear() - newDate.getFullYear()
      console.log(newDate.getFullYear());
      return age;
    }
    return ageDate

edited Sep 28, 2023 at 9:02

Adrian Mole

52.2k193 gold badges61 silver badges101 bronze badges

answered Sep 27, 2023 at 1:16

Weda IPutu

1

1 Comment

Community Over a year ago

As it’s currently written, your answer is unclear. Please edit to add additional details that will help others understand how this addresses the question asked. You can find more information on how to write good answers in the help center.

Collectives™ on Stack Overflow

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

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related