Help: calculating the year,month,days of Age using javascript

vinek4 · 10-11-2012, 08:30 AM

guys.. i have some problem regarding this... JAVASCRIPT

i need to fill the month,days,hours,minutes and seconds, please help me..

Quote:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script language = "javascript">
var curDate = new Date();
var mName = new Array();

mName[0] = "January";
mName[1] = "February";
mName[2] = "March";
mName[3] = "April";
mName[4] = "May";
mName[5] = "June";
mName[6] = "July";
mName[7] = "August";
mName[8] = "September";
mName[9] = "October";
mName[10] = "November";
mName[11] = "December";

function initialize()
{
for(var i =0; i <=11; i++)
{
var x=document.getElementById('m');
var opt = document.createElement("OPTION");
x.options.add(opt);
opt.text=mName[i];
opt.value=mName[i];
}

for(var i = 1; i <= 31; i++)
{
var x = document.getElementById('d');
var opt = document.createElement("OPTION");
x.options.add(opt);
opt.text = i;
opt.value = i;
}

for(var i = 1970; i<=curDate.getFullYear(); i++)
{
var x = document.getElementById('y');
var opt = document.createElement("OPTION");
x.options.add(opt);
opt.text = i;
opt.value = i;
}
}

function calculateAge()
{
var mm,dd,yy,year,month;
var bDate,bd;
var msPerGregorianYear = 365.25 * 86400 * 1000;

mm = document.form1.month.value;
dd = document.form1.day.value;
yy = document.form1.year.value;
bd=mm + " " + dd + " , " + yy;
bDate = new Date(bd);
year=Math.floor((curDate - bDate)/ msPerGregorianYear);
document.form1.textfield.value=year + " years old";

}
</script>

</head>
<body onload="initialize()">
<form id="form1" name="form1" method="post" action="">
<label for="select"></label>
<div align="center">
<p>Set Your Birth Date </p>
<p>
<select name="month" id="m">
</select>
<label for="select2"></label>
<select name="day" id="d">
</select>
<label for="select3"></label>
<select name="year" id="y">
</select>
</p>
<p>Year/s
<label for="textfield"></label>
<input type="text" name="textfield" id="textfield" />
Month/s
<label for="textfield2"></label>
<input type="text" name="textfield2" id="textfield2" />
Day/s
<label for="textfield3"></label>
<input type="text" name="textfield3" id="textfield3" />
</p>
<p>Hour/s
<label for="textfield4"></label>
<input type="text" name="textfield4" id="textfield4" />
Minute/s
<label for="textfield5"></label>
<input type="text" name="textfield5" id="textfield5" />
Second/s
<label for="textfield6"></label>
<input type="text" name="textfield6" id="textfield6" />
</p>
<p>
<input type="button" name="button" id="button" value="calculate age" onclick="calculateAge()" />
</p>
</div>
</form>
</body>
</html>

Philip M · 10-11-2012, 08:44 AM

As you are working with seconds you would do best to use the getTime() method which returns the number of milliseconds between midnight of January 1, 1970 and the specified date.

You can then compare the value for now with the user's birthdate and convert the difference to days, hours, minutes, seconds.

Code:

function secondsToString(seconds) {
 
var numdays = Math.floor(seconds / 86400);
var numhours = Math.floor((seconds % 86400) / 3600);
var numminutes = Math.floor(((seconds % 86400) % 3600) / 60);
var numseconds = ((seconds % 86400) % 3600) % 60;
 
return numdays + " days " + numhours + " hours " + numminutes + " minutes " + numseconds + " seconds";
}

It is tricky to calculate the number of months between two dates as the number of days in each month varies. You may find this useful:-

Code:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>DaysWeeksMonths</title>
</head>

<body>
<h2>Enter from and to dates MM/DD/YYYY</h2>
From:<input type="text" id="date1" name="date1" value="1/1/2011"/>
To:<input type="text" id="date2" name="date2" value="1/1/2012" />
<div>How many Days: <span id="outDays"></span></div>
<div>How many Weeks: <span id="outWeeks"></span></div>
<div>How many Months: <span id="outMonths"></span></div>
<div>How many Years: <span id="outYears"></span></div>

<input type="button" onclick="howmanyDWM()" value="GetDate" />


<script type="text/javascript">

function howmanyDWM(){
//Set the two dates
var date_1 = document.getElementById("date1").value;
var date_2 = document.getElementById("date2").value;

//Get 1 day in milliseconds
var one_day = 1000*60*60*24;
//Get 1 week in milliseconds
var one_week = 1000*60*60*24*7;
var one_month = 4.348 * one_week;
var one_year = 1000*60*60*24*365;

date1 = new Date(date_1); //Month is 0-11 in JavaScript
date2 = new Date(date_2);

//Calculate difference btw the two dates, and convert to days
var resultDays = Math.abs(Math.ceil((date2.getTime()-date1.getTime())/(one_day)));
var resultWeeks = Math.abs(Math.floor((date2.getTime()-date1.getTime())/(one_week)));
var resultMonths = Math.abs(Math.round((date2.getTime()-date1.getTime())/(one_month)));
var resultYears = Math.abs(Math.floor((date2.getTime()-date1.getTime())/(one_year)));

document.getElementById("outDays").innerHTML = resultDays;
document.getElementById("outWeeks").innerHTML = resultWeeks;
document.getElementById("outMonths").innerHTML = resultMonths;
document.getElementById("outYears").innerHTML = resultYears;

} 
</script>
</body>
</html>

But does anyone really care about their age in hours, minutes, seconds? Or knows the time of their birth that accurately? Obviously the hours, minutes, seconds calculated from midnight on the birthday are not at all an accurate statement - meaningless in fact.. Or is this just a homework exercise?

You can shorten your code to
var mName = ["January","February","March","April","May","June","July","August","September","October","November"," December"];

<script language=javascript> is long deprecated. Use <script type = "text/javascript"> instead (in fact also deprecated but still necessary for IE<9).

BTW, when posting here please help us to help you by following the posting guidelines and wrapping your code in CODE tags. This means use the octothorpe or # button on the toolbar. You can (and should) edit your previous post.

All advice is supplied packaged by intellectual weight, and not by volume. Contents may settle slightly in transit.