CODEWITHSUNDEEP
javascriptjqueryhtmljquery-ui-datepickerdate-formatting
Ibrahim Amer
Ibrahim Amer

Reputation: 1218

Calculate age based on date of birth for dd/mm/yyyy date format

I want to calculate the age based on the date of birth. I can do it easily for date format mm/dd/yyyy but when I try to do the same for dd/mm/yyyy I got age = NaN. Here is my code logic: 

$('#DateOfBirth').datepicker({
        onSelect: function (value, ui) {
            var today = new Date(),
                dob = new Date(value),

                age = today.getFullYear() - dob.getFullYear(); //This is the update
            $('#age').val(age);
            alert(age);
        },
        //maxDate: "-16Y",
        maxDate: maxDateVal,
        showOn: "both",
        buttonImage: "",
        dateFormat: "dd/mm/yy",
        changeMonth: true,
        changeYear: true,
        yearRange: '1920:c'

    }).keydown(function (e) {
        if (e.keyCode == 8 || e.keyCode == 46) {
            $(e.target).val("");
        } else {
            e.preventDefault();
            return false;
        }
    });

Upvotes: 2

Views: 7469

Answers (2)

Sandipan Guha
Sandipan Guha

Reputation: 126

found it! this is the complete code of mine:

<head>
<title>Know your age</title>
</head>

<body>
<div>

<h3>Enter your Birth Date</h3> </div>
<div><input type="date" id="birthdate" /> <input type="button" value="Submit" id="acceptbutton" /> </div>
</body>
<script>
function getAge(){
var newDateObject = new Date();

var newObjectCurrentYear = newDateObject.getFullYear();

var userDateObject = document.getElementById("birthdate").value;

var userDateObjectPieces = userDateObject.split("-");

var userObjectYear = userDateObjectPieces[0];

if ( newObjectCurrentYear > userObjectYear){
var currentAge = parseInt(newObjectCurrentYear) - parseInt(userObjectYear);
alert("Your Current Age is: " + currentAge + " " +(currentAge>1?"years":"year"));
}

else{
alert("Birth-Year must be lower than Current-Year.\nPlease Enter Again.");
}

}

var simpleButton = document.getElementById("acceptbutton");
simpleButton.addEventListener("click",getAge);
</script>
</html>

This will give you your current age in alert box.

P.S. point to say, 'date' input not supported in all browsers!Works properly on Chrome!

Upvotes: 1

Chris L
Chris L

Reputation: 1061

The reason this happens is because new Date(ValueHere) calls Date.parse() which requires a valid format. See below for reference to specifics.

A solution for you, with Regex.

Instead Of:

dob = new Date(value),

Use: (Edited for your particular format)

dob = new Date(value.replace(/(\d{2})[-/](\d{2})[-/](\d+)/, "$2/$1/$3"));

A trimmed down fiddle to demonstrate solution: (updated for your particular format)

http://jsfiddle.net/chrislewispac/e7zjskos/2/

from: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date

and: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/parse

new Date(dateString);

dateString:

String value representing a date. The string should be in a format recognized by the Date.parse() method (IETF-compliant RFC 2822 timestamps and also a version of ISO8601).

Invalid values in date strings not recognized as ISO format as defined by ECMA-262 may or may not result in NaN, depending on the browser and values provided.

Link to ECMA-262 date standards:

http://www.ecma-international.org/ecma-262/6.0/index.html#sec-date-time-string-format

And link to StackOverflow solutions:

Convert dd-mm-yyyy string to date

Upvotes: 5

Related Questions