Validating the age in a form and not getting output, not sure what's incorrect

Question

So I'm making a form which accepts a name, an age, and an Identification Card number.

The format of the IC number is yymmdd-xx-xxxx where the first four numbers are the D.O.B. of the person. The last four numbers are a unique code of the IC and the two numbers in between are state codes for where the person is born in. What I want to do is to take the first two numbers of the IC number (year person is born in), and deduct it with the current year, and compare that to the age the person gave and the output would say that the age is correct or incorrect.

Here is what I have tried so far.

function valForm() {

  function valName() {
    var regexName = /^[a-zA-Z]*$/;

    if (regexName.test(document.ageVal.name.value)) {
      return true;
    } else {
      return false;
    }
  }

  function valIc() {
    var regexIc = /^\d{6}-\d{2}-\d{4}$/;
    if (regexIc.test(document.ageVal.icNum.value)) {
      return true;
    } else {
      return false;
    }
  }

  if (!valName()) {
    alert("Enter a name using only alphabets");
    document.ageVal.name.focus();
    document.getElementById("notifName").innerHTML = "Alphabets only";
  }

  if (!valIc()) {
    alert("Correct format is xxxxxx-xx-xxxx");
    document.ageVal.icNum.focus();
    document.getElementById("notifIc").innerHTML = "Not the correct format";
  }

  var today = new Date();
  var year = today.getFullYear();

  var yr = document.getElementById("icNum");

  var yrIc = parseInt(yr, 10);

  while (yrIc >= 100)
    yrIc = Math.floor(yrIc / 10);

  fullyrIc = 1900 + yrIc;

  var actAge = year - fullyrIc;

  var givnAge = document.getElementById("age");

  if (actAge == givnAge)
    document.getElementById("output").innerHTML = "Age is correct";
  else
    document.getElementById("output").innerHTML = "Age is not correct";

}

<form name="ageVal" action="javascript:valForm()">
  <table border="solid" width="25%">
    <tr>
      <td>Name: &nbsp;</td>
      <td colspan=2>
        <input type="text" name="name" id="age">
        <div id="notifName"></div>
      </td>
    </tr>

    <tr>
      <td>Age: &nbsp;</td>
      <td colspan=2>
        <input type="number" name="age" id="age">
        <div id="notifAge"></div>
      </td>
    </tr>

    <tr>
      <td>IC: &nbsp;</td>
      <td colspan=2>
        <input type="text" name="icNum" id="icNum">
        <div id="notifIc"></div>
      </td>
    </tr>

    <tr>
      <td colspan=3 align="center">
        <input type="text" name="output" id="output" disabled>
      </td>
    </tr>
  </table>
  <input type="submit" form="ageVal" value="Submit">
</form>

I can't get any output after trying out a lot and making a lot of changes. I'm still new to JS and even newer to trying regex so I'm sure I'm doing a lot of things wrong here.

After some changes I can finally get an output thanks to the first two answers but the problem now is that the calculations are not correct. How should I correct it?

gp. · Accepted Answer · 2016-03-13 11:22:01Z

1

output id element is input element. Use value property to set value instead of innerHTML to see any output:

if (actAge == givnAge)
   document.getElementById("output").value = "Age is correct";
else
   document.getElementById("output").value = "Age is not correct";

JS Fiddle

edited Mar 13, 2016 at 11:22

answered Mar 13, 2016 at 11:17

gp.

8,2533 gold badges42 silver badges42 bronze badges

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

1 Comment

nisyedlah Over a year ago

Still no change somehow. Are my calculations correct?

Gouthamm4G · Accepted Answer · 2016-03-13 11:37:14Z

1

In the script you are getting the element instead of the value. Change this...

var yr = document.getElementById("icNum");
var givnAge = document.getElementById("age");

Into this...

var yr = document.getElementById("icNum").value;
var givnAge = document.getElementById("age").value;

You should have no issues now. But I do not understand what you are doing from while loop. Could you explain.

answered Mar 13, 2016 at 11:37

Gouthamm4G

3110 bronze badges

6 Comments

nisyedlah Over a year ago

The while loop is to get the first two numbers of the IC number. Then add 1990 to it and deduct that with the current year and compare it, then telling if it's correct or incorrect. Is it incorrect?

Gouthamm4G Over a year ago

Why do you add 1990? Give me an example

nisyedlah Over a year ago

Made an edit, it's 1900 instead of 1990 very sorry. But for example, the first two numbers are 90, then 1900 + 90 = 1990 as year of birth. Then, 2016 - 1990 is 26 and that would be compared with givnAge which is the user given age.

Gouthamm4G Over a year ago

To get the first two numbers you can do var yr = parseInt(yrIc.substr(0,2), 10). This is more accurate.

Gouthamm4G Over a year ago

Also your document.getElementById("age") would give you two elements. So have only one element with age as id.

|

Aral Roca · Accepted Answer · 2016-03-13 11:57:02Z

1

Issue 1

You need to put the javascript call in onsubmit with a return:

 <form name="ageVal" method="POST" action="javascript:void(0);" onsubmit="valForm()">
 <!--- rest of code -->

Issue 2

You forget to add .value on document.getElementById("icNum") and on document.getElementById("age"):

var yr = document.getElementById("icNum").value;
var givnAge = document.getElementById("age").value;

You can check your code working here:

https://jsfiddle.net/4459z225/1/

edited Mar 13, 2016 at 11:57

answered Mar 13, 2016 at 11:12

Aral Roca

6,0078 gold badges52 silver badges83 bronze badges

5 Comments

nisyedlah Over a year ago

I still don't get an output though. Is there a difference between onsubmit and action?

Aral Roca Over a year ago

I added a jsfiddle than you can check your code working :) jsfiddle.net/4459z225

Aral Roca Over a year ago

Check this answer to see the difference between action and onsubmit: stackoverflow.com/a/16484321/4467741

nisyedlah Over a year ago

Thanks a lot, at least there's finally an output! But now I have a problem with the calculations. I put in the correct age and year but the answer says it's incorrect.

nisyedlah Over a year ago

Thanks! Learnt something new today.

Nitin9791 · Accepted Answer · 2016-03-13 12:11:55Z

0

For Simple Age Calculation replace

var today = new Date();
  var year = today.getFullYear();

  var yr = document.getElementById("icNum");

  var yrIc = parseInt(yr, 10);

  while (yrIc >= 100)
    yrIc = Math.floor(yrIc / 10);

  fullyrIc = 1900 + yrIc;

  var actAge = year - fullyrIc;

with

var regex = /^(\d{2})(\d{2})(\d{2})/;
var dob = document.getElementById("icNum").match(regex);
var dobYear = dob[1];
var dobMonth = dob[2];
var dobDate = dob[3];
var birthday = new Date(dobYear+'/'+dobMonth+'/'+dobDate);
var ageDifMs = Date.now() - birthday.getTime();
var ageDate = new Date(ageDifMs); // miliseconds from epoch
var actAge = Math.abs(ageDate.getUTCFullYear() - 1970);

answered Mar 13, 2016 at 12:11

Nitin9791

1,1441 gold badge14 silver badges18 bronze badges

Collectives™ on Stack Overflow

Validating the age in a form and not getting output, not sure what's incorrect

4 Answers 4

1 Comment

6 Comments

Issue 1

Issue 2

5 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

6 Comments

Issue 1

Issue 2

5 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related