Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations SkipVought on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Display Javascript Function Next to Inputbox 2

Status
Not open for further replies.
FireGeek21

FireGeek21

Technical User
Dec 12, 2007
218
0
0
US
Hi,

I have been working with HTML for a while but have done nothing fancy (yet). Starting to incorporate some javascript into my HTML. My first task is to display a person's age based on the birthdate entered into an input box. I can't seem to get the age to show next to the input box. Here is the code I have been working with. Thanks for the help!!!
HTML: 
<html>
<head>
<title>Display Age Calculation</title>

<script type="text/javascript">
function calcAge(birthMonth, birthDay, birthYear)
{
todayDate = new Date();
todayYear = todayDate.getFullYear();
todayMonth = todayDate.getMonth();
todayDay = todayDate.getDate();
age = todayYear - birthYear; 
if (todayMonth < birthMonth - 1)
{
age;
}
if (birthMonth - 1 == todayMonth && todayDay < birthDay)
{
age;
}
return age;
}
</script>
</head>

<body>

<form>
<input type="text" name="birthdate" onblur="calcAge()"><div  id="agecalc">Your Age: </div>
</form>

</body>
</html>

FireGeek
(currently using Crystal Reports XI with Lawson 9.01)
 
Sort by date Sort by votes
A div is a block level element. Which means it occupies the entire width of a horizontal row with a line break above and below it.

Use an inline element as the text container.

Chris.

Indifference will be the downfall of mankind, but who cares?
Time flies like an arrow, however, fruit flies like a banana.
Webmaster Forum
 
Upvote 0 Downvote
Thanks for the response Chris. I guess the issue is not so much where the age shows as it is that the age isn't showing at all. Not sure if the Javascript is working which is why this was also posted in the Javascript forum - someone deleted the post from that forum!

UGH!

FireGeek
(currently using Crystal Reports XI with Lawson 9.01)
 
Upvote 0 Downvote
Your function doesn't seem to be writing out your age value anywhere at all.

Perhaps incorporating something to write the age out may be useful.

Code: 
document.getElementById("agecalc").innerHTML = age;



----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Web & Tech
 
Upvote 0 Downvote
Thank you for the response Vacunita. Where would be the best location for your recommended line of code?

FireGeek
(currently using Crystal Reports XI with Lawson 9.01)
 
Upvote 0 Downvote
instead of return age;

Chris.

Indifference will be the downfall of mankind, but who cares?
Time flies like an arrow, however, fruit flies like a banana.
Webmaster Forum
 
Upvote 0 Downvote
Anywhere after you've set the value of age, probably best before the return(), or instead of it.

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Web & Tech
 
Upvote 0 Downvote
Hey folks... Still can't seem to ge the age to show next to the input box. Not sure what else I need to try. Any help is greatly appreciated!

Thanks

FireGeek
(currently using Crystal Reports XI with Lawson 9.01)
 
Upvote 0 Downvote
Still can't seem to ge the age to show next to the input box.
Click to expand...

Define the above

It is not showing adjacent to?
OR
It is not showing at all?

Chris.

Indifference will be the downfall of mankind, but who cares?
Time flies like an arrow, however, fruit flies like a banana.
Webmaster Forum
 
Upvote 0 Downvote
It is not showing at all.

FireGeek
(currently using Crystal Reports XI with Lawson 9.01)
 
Upvote 0 Downvote
Have you tried actually passing any values to the function??


Because the code you posted does not get any values from anywhere at all.

Chris.

Indifference will be the downfall of mankind, but who cares?
Time flies like an arrow, however, fruit flies like a banana.
Webmaster Forum
 
Upvote 0 Downvote
I am at a loss as to how to do this, how to proceed.

FireGeek
(currently using Crystal Reports XI with Lawson 9.01)
 
Upvote 0 Downvote
The function needs three values passing to it in the correct order (month, Day, year)

Chris.

Indifference will be the downfall of mankind, but who cares?
Time flies like an arrow, however, fruit flies like a banana.
Webmaster Forum
 
Upvote 0 Downvote
General Programming 101:

If you define your function to expect 3 parameters:
calcAge(birthMonth, birthDay, birthYear)

You need to pass it 3 paramters.

You aren't passing it anything.
onblur="calcAge(__)"

If what you want is to get the information from the input itself, then you need to address the input.

Lets start simple, and simply pass the actual input to the function so we can use it.:

Code: 
function calcAge([b]inputObj[/b])
{
...
}

Then in your call:
Code: 
<input type="text" name="birthdate" onblur="calcAge([COLOR=#204A87][b]this[/b][/color])">

"this" is a special word. It references the object that the code is running in. In this case the input.

Now that we have the input, we can get its value.
Code: 
function calcAge(inputObj)
{
[tab]alert(inputObj.value);  
}

This should show us the value that the input box currently has. From there we can perform some operations on that value to extract the birthday, birthmonth, and birthyear values you need.

Code: 
function calcAge(inputObj)
{
[tab]var birthmonth = inputbObj.split("-")[0];
[tab]var birthday = inputbObj.split("-")[1];
[tab]var birthyear = inputbObj.split("-")[2];
}

Assuming the date is being entered as MM-DD-YYYY That should give us the 3 values you want. You can again use an alert to make sure you are getting the desired output.

From there, and assuming the rest of the code works(haven't checked it out in detail) it should perform the operations and output the age.

I would strongly suggest a JS tutorial to get the basics.

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Web & Tech
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

soni21
  • Locked
  • Question
JavaScript String to Number Conversion in HTML: Seeking Clarification
Replies
4
Views
303
Chris Miller
Chris Miller
PeDa
  • Locked
  • Question
Media query: display = none/inline/block 1
Replies
1
Views
156
PeDa
PeDa
bdwilcox
  • Question
More efficient / manageable way to code this HTA w/ VBScript?
Replies
0
Views
159
bdwilcox
bdwilcox
Mike Lewis
  • Locked
  • Question
How to refresh a Javascript file in the browser's cache?
Replies
4
Views
273
Mike Lewis
Mike Lewis
Expoverse
  • Locked
  • Helpful tip
Solution to CSS Two Level Horizonal Menu 1
Replies
1
Views
158
pmonett
pmonett

Part and Inventory Search

Sponsor

Back
Top