Databases
StackOverflow2013
Postsdbo
POReturn JavaScript age calculation to screen
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POReturn JavaScript age calculation to screen
    primarykey
    data
    text
    <p>Using HTML 5, CSS, JavaScript and JQuery to create a web application.</p> <p>I have used the new Date() function in order to generate today's date. I have also used the JQuery "datepicker" function in order to allow the user to select their DOB. These are both working perfectly.</p> <p>What I want is for the age to be calculated when the DOB has been selected. I have included a function to calculate the age which relies on the date and DOB but cannot get it to return the number to the screen. This can be seen below.</p> <pre><code>&lt;tr&gt; &lt;td&gt;Age:&lt;/td&gt; &lt;!--td&gt;&lt;input type="text" id="age" /&gt;&lt;/td--&gt; &lt;td&gt; &lt;script type = "text/javascript"&gt; var date = document.getElementById("adDate").value var dob = document.getElementById("datepicker").value var pattern = /^\d{1,2}\/\d{1,2}\/\d{4}$/ if (pattern. test(dob)) { var currentYear = date.getFullYear() var birthYear = date.getFullYear() var age = currentYear - birthYear document.write(age) } &lt;/script&gt; &lt;td&gt; &lt;/tr&gt; </code></pre> <p>I have search for solutions on-line but just get the basic JavaScript age calculation. Any help would be much appreciated.</p> <p>Many Thanks.</p> <p>I tried to apply some changes so to no avail. I have updated the JS which is shown below.</p> <pre><code>var date = document.getElementById("adDate").value var dob = document.getElementById("datepicker").value var pattern = /^\d{1,2}\/\d{1,2}\/\d{4}$/ if (pattern. test(dob)) { var currentYear = new Date(date).getFullYear() var birthYear = new Date(dob).getFullYear() var age = currentYear - birthYear var spanAge = document.getElementById("age") spanAge.innerHTML = age } </code></pre> <p>And also the HTML.</p> <pre><code>&lt;tr&gt; &lt;td&gt;Age:&lt;/td&gt; &lt;td&gt;&lt;span id="age"&gt;&lt;/span&gt;&lt;/td&gt; &lt;/tr&gt; </code></pre> <p>It must be something to do with using the datepicker to generate the DOB. I tried applying an onSelect function but nothing seems to work.</p> <p>Any other advice?</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PTQuestion
    1. USBenjamin Gruenbaum
    1. USuser2019745
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    2. PO
      singulars
      1. PTAnswer
    3. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POReturn JavaScript age calculation to screen
      1. This table or related slice is empty.
      1. VTUpMod
    2. VO
      singulars
      1. POReturn JavaScript age calculation to screen
      1. This table or related slice is empty.
      1. VTUpMod
    1. CObirthYear should not use date. You should also create Date objects with the value from the UI elements.
      singulars
      1. POReturn JavaScript age calculation to screen
      1. USnullable
    2. COYou need an event to trigger the calculation. I would reccomend using onSelect http://api.jqueryui.com/datepicker/#option-onSelect for the Datepicker
      singulars
      1. POReturn JavaScript age calculation to screen
      1. USjtheman
    3. COAh I see. Thanks for your fast replies!
      singulars
      1. POReturn JavaScript age calculation to screen
      1. USuser2019745
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

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