Javascript to display current age

This site is best viewed in a modern browser with JavaScript enabled.

aimalou

I am looking for a javascript to display the current age of an individual. The website is for my granddaughter and I would like to be able to say, "Today I am 6 months, 3 days old". Is there an easy way to do this??

Thank you,
aimalou

GUIR

I'll try to do this also & post results soon.

However I think it may help you if you visit the following URL

http://javascript.internet.com/calculators/date-difference.html

Regards

aimalou

GUIR, thank you for the Date Difference script. Although it's really a neat script, it's a little more that what I'm looking for. All I need are years, months and days and I don't want any fields to be filled out.

aimalou

JPnyc

I have that exact function written, on my home pc. Once I'm home, around 6pm, I'll post the code for you.

aimalou

You rock, DUNSEL! I really appreciate this!

aimalou

JPnyc

Entire html page, containing the function

<html>
<head>
<script language="javascript">
<!--
function Age()
{
var bday=parseInt(document.forms[0].txtBday.value);
var bmo=(parseInt(document.forms[0].txtBmo.value)-1);
var byr=parseInt(document.forms[0].txtByr.value);
var byr;
var age;
var now = new Date();
tday=now.getDate();
tmo=(now.getMonth());
tyr=(now.getFullYear());

{
if((tmo > bmo)||(tmo==bmo & tday>=bday))
{age=byr}

else
{age=byr+1}
alert("As of today, "+now+' \n'+", you are:"+(tyr-age)+ " years old");
}}
//-->
</script>
</head>
<body >

<form><center>
Enter your birthday  <input type="text" name="txtBday" size="2"><br/>
Enter your birth Month(1-12)<input type="text" name="txtBmo"size="2"><br/>
Enter your 4 digit birth year<input type="text" name="txtByr"size="4" ><br/>
<input type="submit" value="submit" onClick="Age()"><input type="reset" value="reset"></center>
</form>
</body>
</html>

aimalou

Hi Again!
This isn't exactly what I was looking for either. I don't want any fields to have to be filled out. . Just a line that says, "Today I am months & days old." Does anyone else have any ideas?

Thanks in advance,
aimalou

GUIR

At this time I'm not at home. Today or Tommorow I'll go there and try.

If you do not wish to fill blanks of code, please let me know your granddaughter/grandson (I don't rem son or daughter), then I'll be able to put it in code.

Regards

JPnyc

How is it going to know how old you are if you don't tell it when you were born? You mean you want a hard coded function for a single person, and every time they load it it will display their age that day? Well it'll be similar to that, just with no variables. You have to put in the kid's info

<html>
<head>
<script language="javascript">
<!--
function Age()
{
var bday= day of month kid was born, as a number ;
var bmo=month of birth, as a number;
var byr= yr of birth as a 4 digit number;
var age;
var now = new Date();
tday=now.getDate();
tmo=(now.getMonth());
tyr=(now.getFullYear());

{
if((tmo > bmo)||(tmo==bmo & tday>=bday))
{age=byr}

else
{age=byr+1}
Alert("As of today, "+now+' \n'+", you are:"+(tyr-age)+ " years old");
}}
//-->
</script>
</head>
<body >

</body>
</html>

GUIR

As I said earlier I tried on your problem and It seems like working as you wanted.
It also works in leap years.
It can also give age of an infant less than 1 month old.
Try with code given below.

Since, I am very new to JavaScript there may be bugs & other exceptions.Also this code can be very lengthy. However I can say 99+% working correct.
If you found any inform me.
I have only noticed two bugs happenning in rare occasions.

If client's (ur site's visitor) PC having incorrect System Date.
If the given birthday is 29th February of a leap year.

<html>

<head>

</head>

<font face="Comic Sans MS" color="#FFFF00" style="font-size: 9pt">

// Code by : GUIR, www.hansaya.com

//Varibles containg values of date of birth : Replace with your own values
//Default date given : 03.11.1981 (dd.mm.yyyy) = my date of birth
var dayOfBirth = 3; //your literal date of birth
var monthOfBirth = 11; //your month of birth
var yearOfBirth = 1981; //your year of birth :: Use all the 4 digits, not 2 two digits in short form

//Variables containg values of current date
var today = new Date();
var dayOfToday = parseInt(today.getDate());
var monthOfToday = today.getMonth() + 1;
var yearOfToday = today.getYear();

//Variables required to calculate age.
var yearDiff;
var monthDiff;
var daysDiff;

var totalNumOfDaysOfMonths = [31,28,31,30,31,30,31,31,30,31,30,31];
var ageString;

AgeUptodate();

function AgeUptodate()
{
	calcYearDiff();

}

function calcYearDiff()
{
	if (monthOfToday > monthOfBirth)
	{
		yearDiff = yearOfToday - yearOfBirth;
		monthDiff = monthOfToday - monthOfBirth;
		calcDateDiff();
	}	

	else if (monthOfToday == monthOfBirth)
	{
		if((dayOfToday == dayOfBirth) || (dayOfToday > dayOfBirth))
		{
			yearDiff = yearOfToday - yearOfBirth;
		}	
		else
			yearDiff = yearOfToday - yearOfBirth - 1;

		calcMonthDiff();

	}
	else
	{
		yearDiff = yearOfToday - yearOfBirth - 1;
		monthDiff = 12 - (monthOfBirth - monthOfToday);

		calcDateDiff();
	}	

}

function calcMonthDiff()
{
	if (monthOfToday == monthOfBirth)
	{
		if (dayOfToday > dayOfBirth)
			monthDiff = monthOfToday - monthOfBirth;
		else if ( dayOfToday == dayOfBirth )
			monthDiff = 0; // That's a Birthday
		else
			monthDiff = 11; // Birthday coming soon
	}
	calcDateDiff();
}

function calcDateDiff()	
{
	if ( yearOfToday % 4 == 0 )
		totalNumOfDaysOfMonths[1] = 29;

	if (dayOfToday > dayOfBirth)
		daysDiff = dayOfToday - dayOfBirth;
	else if (dayOfToday == dayOfBirth)
		daysDiff = 0;
	else
	{
		daysDiff = ( totalNumOfDaysOfMonths[monthOfToday - 1] - dayOfBirth) + dayOfToday;
	}	


	process();	

}

function process()
{
	if((monthOfToday > monthOfBirth) && (dayOfToday < dayOfBirth))
			monthDiff -= 1;

	if(yearDiff == 0)
		ageString = '';
	else if (yearDiff == 1)
		ageString = yearDiff + ' year';
	else
		ageString = yearDiff + ' years';

	if((!((monthDiff == 0) && (daysDiff == 0))) && (yearDiff != 0))
		ageString = ageString + ', ';	

	if(monthDiff == 0)
		ageString = ageString +'';
	else if (monthDiff == 1)
		ageString = ageString + '1 month ';
	else
		ageString = ageString + monthDiff +' months ';

	if(daysDiff == 0)
		ageString = ageString + '';
	else if (daysDiff == 1)
	{
		if(!(yearDiff == 0) && (monthDiff == 0))
			ageString = ageString + 'and 1 day';
		else
			ageString = ageString + '1 day';
	}			
	else
	{
		if(!(yearDiff == 0) && (monthDiff == 0))
			ageString = ageString + 'and ' + daysDiff +  ' days';
		else
			ageString = ageString + daysDiff + ' days';
	}


	document.write('I am ' + ageString + ' old today.');			
}

//--></script>

</font></p>
</body>

</html>

<!--*************** End Of Code>

Regards

wchannaa

Aimalou

I realize this response comes a year late. My daughter was born earlier this month and I felt the need for a similar script. I worked on it until I was satisfied with it. I think it's what you are looking for.

I wrote a function which says a persons age in english just like I would say it if I was asked. I mean for example if a kid is born on Feb 1st 2002, and today is September 25th 2005 that kid is 3 years, 7 months and 24 days old, but who in the world says that?? "My kid is 3 years 7 months and 24 days old"!?? No, I would probably say "My kis is 3 and 1/2 years old". Thats what my script does.

It tries to show the relavent detail in the age wether its few days, few weeks, few months, or few years it describes it appropriately.

The kid is "3 days old"
or "3 weeks and 1 day old"
or "4 1/2 months"
or "16 months"
or "2 years"
etc..

The code is split into two part, the javascript function getAge(birth) which takes the birth date as a parameter and then the HTML code where you tell it the birth date.

In this example I am using an arbitrary example for birth date January 1st 2000. You can change that to whenever your grandchild was born.

var now = new Date();

aSecond = 1000;
aMinute = aSecond 60;
aHour = aMinute 60;
aDay = aHour 24;
aWeek = aDay 7;
aMonth = aDay * 30;

var age = now.getTime() - birth.getTime();

if (age < 0) {
return "not born yet"
}

years = (new Date(now.getTime() - aMonth (birth.getMonth()) )).getYear()
- (new Date(birth.getTime() - aMonth (birth.getMonth()) )).getYear();

offsetNow = (new Date(now.getTime() - aDay (birth.getDate() -1) ));
offsetBirth = (new Date(birth.getTime() - aDay (birth.getDate() -1) ));
if(years > 1){
months = years12 + ( offsetNow.getMonth() - offsetBirth.getMonth()) ;
}else{
months = (now.getYear() - birth.getYear())12 + ( offsetNow.getMonth() - offsetBirth.getMonth()) ;
}

agestr="";

if (months < 24){
weeks = Math.floor(age / aWeek);
age -= weeks * aWeek;
days = Math.floor(age / aDay);

if(weeks > 0){
	if(weeks == 1){
		agestr = agestr + weeks + " week ";
	}else if(weeks < 9){
		agestr = agestr + weeks + " weeks ";
	}else{
		agestr = agestr + months ;

		if(now.getDate() - birth.getDate() > 10){
			agestr = agestr + " ½ ";
		}
		agestr = agestr + " months ";

	}
}

if(days > 0){

	if(weeks < 9){
		if(weeks > 0){
			agestr = agestr + " and ";
		}
		if(days == 1){
			agestr = agestr + days + " day ";
		}else{
			agestr = agestr + days + " days ";
		}
	}
}

}else{
agestr = agestr + years;
if (months%12 > 5 && years<14){
agestr = agestr + " ½ ";
}
agestr = agestr + " years ";
}

return agestr;
}
// -->
</script>
</head>

<BODY>
<BR>
<BR>
<BR>
<CENTER>
<BR>
<script type="text/javascript">
document.write("<font size=6> I am " + getAge(new Date("January 1, 2000 ")) + " old</font>");
</script>
</CENTER>
</body>
</html>

bradymc

wchannaa, this is EXACTLY what I was looking for! Thanks for posting this.

There's only one problem. Any date that is put in prior to January 1, 2000 (i.e. December 31, 1999 or earlier) adds characters to the output of the script. For example, if someone was born October 12, 1998, they would be 7 years old. But the output says "1907 years old".

Any thoughts on how to fix this?

bradymc

Just in case anyone else finds this thread, I discovered the coding flaw for this age calculator. Use date.getFullYear instead of date.getYear. Problem solved!

aaansuuu

I am trying to use this code, but there is something wrong with the months. When trying to show months, it also adds some weird symbol: �
Also when someone is 1 year old, it still says 12 months, not 1 year.
Can someone please look into this, I really don't know how to fix this.

Best code for calculating age I have found though, most show only years.

bradymc

I'm not sure about the weird symbol. But given that the code is 6-7 years old (even after I found an update to the code) there may be some deprecated JS getting used.

As to the issue of showing "12 months" vs. "1 year"... That's the way this code was designed. Babies/toddlers are said to be xx months old until they reach the age of 2. I don't know why, but that's what it is.

aaansuuu

Thank you for your answer!

It's difficult for me to understand how it actually works, so I wanted to ask about this line:

if (months%12 > 5 && years<14){

Is it correct or are some marks wrong here?
I'm still trying to fix the symbol, but don't know where it could come from. Maybe you could help me find out?

bradymc

That line of code is checking for 2 conditions. That's what the "&&" characters are testing... to see that both conditions qualify to execute the code that follows.

Condition 1
if (months%12 > 5)
The percent sign (%) is calculating the remainder of division between "months" and the number 12 and seeing if it's greater than 5.
Example 1 - If months=18, the result is 6... because 18 divided by 12 is 1 with 6 leftover. 6 is greater than 5 so that part of the statement is true.
Example 2 - If months=86, the result is 2... because 86 divided by 12 is 7 with 2 leftover. 2 is not greater than 5 so this would be false.

Condition 2
if (years < 14)
14 was the designation to stop showing halves of years in the age. This can be changed to whatever age you like. But this means that you can be 12 1/2 years old, 13 1/2 years old, but when you get to 14, it's just 14 until you turn to 15 and so on.

So in putting these conditions to together, it's saying... If the age is less than 14 and the division remainder is greater than 5, then show their age with a "1/2" in it... 12 1/2, 13 1/2, or whatever the case may be. And if BOTH of those conditions are not met, it skips the following code and moves on down the list.

That's a LOOOONG way of saying that I don't believe that line of code is causing any issues. Let me compare what my last revision was to my file and compare it to what is shown and I'll post my results in a moment.

aaansuuu

Thank you so much for the great explanation!!
Well I now know for sure I shouldn't yet change anything in Javascripts myself

bradymc

I think I know what the problem is...
The "½" that is shown in the code is a special character and the browser can't interpret it unless you use an HTML entity. That's why you get the strange character. So your choices are...
Every time you see "½", you need to retype it as "1/2".
... or ...
Replace "½" with either the entity number or the entity name. Since it's difficult to post these entities without the browser changing them to the "½" symbol again, refer to this page about halfway down: http://www.w3schools.com/tags/ref_entities.asp

aaansuuu

YES! It works!
Thank you bradymc, you really helped me out a lot