Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    New to the CF scene
    Join Date
    Jan 2013
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    calculate age from year of birth

    I have to create a javascript program that calculates age based soely on year of birth subtracted from the current year. I am having issues figuring out how to convert the current year into a variable so i can use it in my function for calculation. Can some one tell me what i am doing wrong.

    Here is the assignment and i have already completed all but the calculation for the age calculator:

    1.**Volume** Of a Box:Allow the user to enter the width, length, and height of a box. When they hit a button that says "View Volume" it multiplies all 3 numbers together and shows the result in a disabled input box. - 50 points

    2.Age: Allow the user to enter their year of birth. When they hit a button that says "Age This Year" it takes the current year and subtracts their year of birth. Display the result in a disabled input box. - 50 points


    <code> <!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>Exercise 1</title>

    <script type='text/javascript'>
    function calculateSum()
    {var a = parseInt(document.getElementById('firstNumber').value);
    var b = parseInt(document.getElementById('secondNumber').value);
    var sum = a*b;
    document.getElementById('sumPlaceholder').value = sum;}</script>

    <script type="text/javascript">
    function calcualteAge()
    {var a = parseInt(document.getElementById('birthyear').value);
    var now = new Date();
    var year = now.getyear();
    var age = year-a;
    document.getElementById('agePlaceholder').value = age;}
    </script>


    </head>

    <body>
    <p>Please enter length and width below and I will give you the area.
    <br />
    Length <input type='text' id='firstNumber' /> <br />
    Width <input type='text' id='secondNumber' /> <br />
    Area: <input type='text' id='sumPlaceholder' disabled='disabled'/> <br />
    <input type="button" id="calculateSum"
    value="Display Sum" onclick='calculateSum()'/></p>

    <p> Please enter your year of birth below and I will tell you your age.
    <br />
    Year of Birth: <input type='text' id='birthyear' /> <br />
    Current Year: <script type='text/javascript'>
    var today = new Date();
    document.writeln(today.getFullYear() );
    </script> <br />

    Age:<input type='text' id='agePlaceholder' disabled='disabled'/> <br />
    <input type="button" id="calculateAge"
    value="Display Age" onclick='calculateAge()'/></p>

    </body>
    </html>
    </code>

  • #2
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,020
    Thanks
    75
    Thanked 4,323 Times in 4,289 Posts
    How much will you KICK yourself?

    Code:
    function calcualteAge()
    ...
    <input type="button" id="calculateAge" 
           value="Display Age" onclick='calculateAge()'/>
    By the by: It's not a great idea to use a function with the same name as some object's ID. It can make later debugging much more difficult, when the browser sees the ID and treats it as a JS name.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #3
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,020
    Thanks
    75
    Thanked 4,323 Times in 4,289 Posts
    p.s.: If you will learn to use a JavaScript debugger, you will be able to find stuff like this yourself in a matter of seconds, minutes at most.

    You can use the JS debugger in any browser, but I personally feel that the one in CHROME browser is the easiest to learn and easiest to use.

    Just bring up your web page in Chrome and then hit the F12 key. And then click on the "Console" tab to see your errors. And then take the time to learn what you can do after you click on the "Source" tab.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #4
    Regular Coder
    Join Date
    Jan 2013
    Location
    Germany
    Posts
    578
    Thanks
    4
    Thanked 77 Times in 77 Posts
    Also by the way: You cannot reliably calculate the age based on year information only. I was born 1990 am I 22 or 23?

  • #5
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,731
    Thanks
    202
    Thanked 2,508 Times in 2,486 Posts
    document.writeln(today.getFullYear() );

    document.writeln() is obsolete. document.write() statements must be run before the page finishes loading. Any document.write() statement that runs after the page finishes loading will create a new page and overwrite all of the content of the current page (including the Javascript which called it). So document.write() is at best really only useful to write the original content of your page. It cannot be used to update the content of your page after that page has loaded.

    You are already using the correct
    document.getElementById('agePlaceholder').value = age;


    Age:<input type='text' id='agePlaceholder' disabled='disabled'/>
    Surely you (and the assignment instructions) mean readonly?
    Be aware that HTML input elements such as textboxes within a form that have the disabled="disabled" attribute will not send their values to the server when the form is submitted. If you want to send the value to the server while still disabling the user from changing it you should make the textbox readonly.
    Last edited by Philip M; 01-21-2013 at 07:56 AM.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #6
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,471
    Thanks
    0
    Thanked 634 Times in 624 Posts
    To correctly calculate someone's age using their date of birth (and validating that they entered it correctly in mm/dd/ccyy format)

    Code:
    Date.prototype.ageLastBirthday = function(dob) {
    var cy, by, db, adj;
    cy = this.getFullYear();
    by = dob.getFullYear();
    db = new Date(dob);
    db.setFullYear(cy);
    adj = (this-db<0) ? 1 : 0;
    return cy - by - adj;
    };
    validateDate = function(y,m,d) {
     var dt;
     if (d !== +d || m !== +m || y !== +y) return false;
     dt = new Date(y, --m, d);
     if (d !== dt.getDate() || m !== dt.getMonth() || y !== dt.getFullYear()) return false;
     return dt;
     }
    
    var db = document.getElementById('dateOfBirth').value.split('/');
    if (validateDate(d[2],d[0],d[1]) {
       var today = new Date();
       var dob = new Date(d[2],--d[0],d[1]);
       document.getElementById('agePlaceholder').value = today.ageLastBirthday(dob);
       }
    else document.getElementById('agePlaceholder').value = 'Invalid date of birth entered';
    Last edited by felgall; 01-21-2013 at 08:12 AM.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •