Databases
StackOverflow2013
Postsdbo
POJavaScript Age Validation from DOB for Drop Down Selection
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POJavaScript Age Validation from DOB for Drop Down Selection
    text
    copied!<p>I have seen many Age Validation from DOB codes but none can I seem to get to work with my code.</p> <p>Basically, I am required for my TAFE course to create a form with First Name, Surname, Email address, Contact phone number, Date of Birth and Area of Interest (which is a drop down box with Childrens and Adults Books).</p> <p>I am required to validate the Date of Birth as being in the correct format. I have successfully done this and it equates for 30 day months and Leap Years as well.</p> <p>The next part requires the Area of Interest Drop Down box to validate on submit that the Age of the Person is over 18. BUT. Only if the Area Of Interest chosen is Adults Books.</p> <p>Now, I could do something simple and make it so all ages on and above 1996 will be rejected, but I would rather create a validation that does this from the DOB that was input, as I think this is what is to be expected.</p> <p>The DOB is input in the form of DD/MM/YYYY.</p> <p>This is what I have so far:</p> <pre><code>&lt;script language="JavaScript" type="text/javascript"&gt; function validateForm() { *snipped firstname, surname, email validation* var dob = document.getElementById("dateofbirth").value; *snipped dob validation* var area = document.getElementById("areaofinterest").value; if (area == "") { alert("Please select an Area of Interest!"); return false; } var now = new Date(); var birthdate = dob.split("/"); var born = new Date(dob[2], dob[0], dob[1] * 1 - 1); var age = Math.floor((now.getTime() - born.getTime()) / (365.25 * 24 * 60 * 60 * 1000)); if (area == "adults" &amp;&amp; age&lt;18) { alert("You need to be 18 years of age and older for the Adults books!"); return false; } return true; } &lt;/script&gt; </code></pre> <p>I am only a beginner in JavaScript so there is probably something very obviously wrong with this piece of code. But basically what is written is what I want to achieve.</p> <p>See if the Date of Birth is over 18 if the Adults Books Area of Interest is chosen.</p> <p>The HTML can be seen below of what I have:</p> <pre><code>&lt;form method="post" name="form1" onsubmit="return validateForm()" action=""&gt; Fields marked with * are required to be filled out! &lt;br /&gt; First Name*: &lt;input type="text" id="firstname" name="First Name" placeholder="e.g. John" /&gt; &lt;br /&gt; Surname*: &lt;input type="text" id="surname" name="Surname" placeholder="e.g. Smith" /&gt; &lt;br /&gt; Email address*: &lt;input type="text" id="emailaddress" name="Email Address" placeholder="e.g. john.smith@example.com" /&gt; &lt;br /&gt; Contact phone number: &lt;input type="text" id="phonenumber" name="Contact Phone Number" placeholder="e.g. 0410 224 567" /&gt; &lt;br /&gt; Date of Birth*: &lt;input type="text" id="dateofbirth" name="Date of Birth" placeholder="DD/MM/YYYY" /&gt; &lt;br /&gt; Area of Interest*: &lt;select id="areaofinterest" name="Area Of Interest" /&gt; &lt;option value=""&gt;Select interest&lt;/option&gt; &lt;option value="children"&gt;Books for children&lt;/option&gt; &lt;option value="adults"&gt;Books for adults&lt;/option&gt; &lt;/select&gt; &lt;br /&gt; &lt;input type="submit" value="Submit" /&gt;&lt;input type="reset" value="Reset" /&gt; &lt;/form&gt; </code></pre> <p>I appreciate any feedback. And I am sorry if this has been answered already. I know it has but I cant seem to get it to work for my purpose. I may made a simple format mistake or forgotten something out. It is probably something very obvious.</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload