[RESOLVED] New to javascript but...

**Slyke** · Feb 15th, 2008, 09:10 AM

This is an assignment. I know the rules about not doing people's assignments, but i do need help.

I'm new to javascript (this is my very first script).

I have the following code:

<html>
<head>
<title>
Heartrate calculation program
</title>
</head>

<body bgcolor="#000000">
<font color="#FFFFFF"><big>
Please follow the prompts.

<script>

//Java goes here.

function funcalculate (form)
{
var vage = form.agetxt.value;
var vrhr = form.rhrtxt.value;
var mhr = 0;
var vpmhr = 0;
var vcmhr = 0;
var vlstc = 0;

// Here is the calculations
mhr = (220-vage);
vcmhr = (vrhr-mhr);
vpmhr = (1.60*vcmhr);
vlstc = parseInt(vpmhr)+parseInt(vrhr);

// alert (vlstc);
funwritetopage(vlstc);
}

// document.write(vage);

</script>
<br>
<br>
<br>
<FORM NAME="frmheartrate" ACTION="" METHOD="GET">Please enter your age: <BR>
<INPUT TYPE="value" NAME="agetxt" VALUE="20"><P>
Please enter your RHR (<b>R</b>esting <b>H</b>eart <b>R</b>ate):<br>
<INPUT TYPE="value" NAME="rhrtxt" VALUE="70"><P>
<INPUT TYPE="button" NAME="cmdcalculcate" Value="Calculate" onClick="funcalculate(this.form)">

Your THR (<b>T</b>raining <b>H</b>eart <b>R</b>ate) is: <br>

<script>

funwritetopage(vvalue)
{
// document.write("HI!");
document.write(vvalue);
}
</script>

<br>
<br>
<br>
Yeah.
</big></font>
</body>

</html>

Could someone please tell me why the bolded functions do not execute? I thought it had something to do with them both being in different script tags, but when i put them into the same one, nothing worked because the function that the button fires off is below the actual button.

So if this is the case, then how do i make a 'global' sub that can be called such as what i'm trying to do.

Also, i think the second problem is an error on my part but...
If you enter in 20 into the age and 70 as the RHR you get -138.
On the assignment sheet it says the answer should be 148.

Here are the steps that say how it should be calculated:

a) calculate the maximum heart rate as 220 – age,
b) subtract the RHR from the maximum heart rate,
c) multiply the result in step b) by 60% and then add the RHR.

Is this an error on my part, or is the assignment sheet wrong?
In the code you can see how i've coded this Look for the comment "Here are the calculations"

**timeshifter** · Feb 15th, 2008, 10:08 AM

First, I would comment that Java SUCKS. What you're using here is JavaScript, which is a simplified form of Java designed for quick web use. The names are similar, but the difference is huge

Second, you should have a function keyword in front of the function name, otherwise it isn't read as such:

Code:

<script>
function funwritetopage(vvalue)
{
// document.write("HI!");
document.write(vvalue);
}
</script>

**Slyke** · Feb 15th, 2008, 08:24 PM

Ahhh!!! I see it now. Thanks for that!

Yeah I knew it was java script, but i'm lazy and just write java sometimes, a bad habbit.

Do you know where i'm making a mistake in my calculations?

Also why does it now open up a new tab when it writes to the document? I'm using firefox.

<html>
<head>
<title>
Heartrate calculation program
</title>
</head>

<body bgcolor="#000000">
<font color="#FFFFFF"><big>
Please follow the prompts.

<script>

function calcthr(pvage,pvrhr)
{
// Calculations are here:
var mhr = 0;
var vpmhr = 0;
var vcmhr = 0;
var vlstc = 0;

mhr = (220-pvage);
vcmhr = (pvrhr-mhr);
vpmhr = (1.60*vcmhr);
vlstc = parseInt(vpmhr)+parseInt(pvrhr);
return vlstc;
}

function funcalculate (form)
{
var vage = form.agetxt.value;
var vrhr = form.rhrtxt.value;
var rsult = 0;

rsult = calcthr(vage,vrhr);

// alert (rsult);
funwritetopage(rsult);
}

</script>

<br>
<br>
<br>
<FORM NAME="frmheartrate" ACTION="" METHOD="GET">Please enter your age: <BR>
<INPUT TYPE="value" NAME="agetxt" VALUE="20"><P>
Please enter your RHR (<b>R</b>esting <b>H</b>eart <b>R</b>ate):<br>
<INPUT TYPE="value" NAME="rhrtxt" VALUE="70"><P>
<INPUT TYPE="button" NAME="cmdcalculcate" Value="Calculate" onClick="funcalculate(this.form)">

Your THR (<b>T</b>raining <b>H</b>eart <b>R</b>ate) is: <br>

<script>

function funwritetopage(vvalue)
{
document.write(vvalue);
}
</script>

<br>
<br>
<br>
Yeah.
</big></font>
</body>

</html>

**timeshifter** · Feb 15th, 2008, 10:49 PM

I don't know if it's the problem, but you aren't using the form's parameters for anything, so there's really no reason to have them. It's possible the GET method is producing the new window as a side effect.

As for the equations, just make sure they're right and it should work.

**Slyke** · Feb 15th, 2008, 10:55 PM

Yeah, i've gone over the equations and tried a few different ways, but can't get them to work, so i'll ask my teacher.

Also i don't want it to load up into another tab (It writes it into a new tab for some unknown reason?). Do you know why?

If i change
function funcalculate(form)
To
function funcalculate()

And

onClick="funcalculate(this.form)"
To
onClick="funcalculate()"

Then nothing works.

**timeshifter** · Feb 16th, 2008, 12:10 AM

Which makes perfect sense. You're removing the parameters from parametized functions. What I meant was this line:

Code:

<FORM NAME="frmheartrate" ACTION="" METHOD="GET">

You aren't using the action and method, and you aren't calling it by name.. so why bother? ASP.NET will typically render it named form1, so try changing it to this:

Code:

<form name="form1">

**JPnyc** · Feb 16th, 2008, 12:46 AM

document.write only writes to a new document in the way that you're using it.

**Slyke** · Feb 16th, 2008, 02:15 AM

Originally Posted by JPnyc

document.write only writes to a new document in the way that you're using it.

So how do i make it write to the current document?
Changing it to Form1 doesn't work either, with or without taking the code out, =(.

What is telling it to write to a new document?

**visualAd** · Feb 16th, 2008, 04:36 AM

The document.write method is only available when the document is open. The document is only open while the page is being loaded.

You can change an element with an ID. You need to insert an empty element into the code to access it. The DOM can then be used to access it:

HTML Code:

<span id="changeAble"></span>

Code:

function funwritetopage(vvalue)
{
    var element = document.getElementById('chanageAble').
    var text = document.createTextNode(vvalue);
    var br = document.createElement('br');

    element.appendChild(text);
    element.appendChild(br);
}

Also, use indenting like I have above. It makes the code more readable to others adn yourself.

**Slyke** · Feb 16th, 2008, 09:59 AM

Yep, this works... but how do i write over it?

Instead of it going for example
-138
-138
-138
etc

Everytime i press the button, how can i get it to just rewrite over itself? It's nothing much, but it would make things look nicer.

**visualAd** · Feb 16th, 2008, 10:07 AM

You can use the replace child method to replace the first node, your text node.

Code:

if (element.hasChildNodes()) { // check if it has child nodes first
    replaceChild(text, element.childNodes[0]);
}

**Slyke** · Feb 16th, 2008, 10:20 AM

var element = document.getElementById('chanageAble');
var text = document.createTextNode(vvalue);

if (element.hasChildNodes()) { // check if it has child nodes first
replaceChild(text, element.childNodes[0]);
}
element.appendChild(text);

}

This code just makes one -138 and then doesn't do anything else, even if i change the input values.

I think the reason that it doesn't update the value is because it's reading from the 0 spot in the array. Each time the function is called it creates a new node, but this is just replacing "chanageAble" with what ever is in node 0?

Where can i get a list of properties. Like how do you know "element" has "appendChild"? Please =).

**timeshifter** · Feb 16th, 2008, 03:10 PM

Do some googling. There are quite a few sites that list JS properties for different objects.

**visualAd** · Feb 16th, 2008, 03:29 PM

Originally Posted by Slyke

This code just makes one -138 and then doesn't do anything else, even if i change the input values.

I think the reason that it doesn't update the value is because it's reading from the 0 spot in the array. Each time the function is called it creates a new node, but this is just replacing "chanageAble" with what ever is in node 0?

Where can i get a list of properties. Like how do you know "element" has "appendChild"? Please =).

You need to add an else to your if statement. If you don't the appendChild statement will get executed everytime.

**Slyke** · Feb 16th, 2008, 08:03 PM

Still just does it the first time and then doesn't change or add anything onto the end. I tried moving the bolded line inside the else, but same results. I'm sure that's how else statements are constructed.

**timeshifter** · Feb 16th, 2008, 08:24 PM

Use Firefox, get the Web Developer toolbar, and see if any JS errors are being thrown. Fx has the nice ability to actually TELL you what the error is... as opposed to IE "an error occurred".

DISCLAIMER:
This isn't a disclaimer. I hate IE. It sucks. Fx beats the crap out of it in every department, ESPECIALLY for web developers.

**Slyke** · Feb 16th, 2008, 10:20 PM

Well i downloaded that and it didn't report any errors. So i checked with HTML Kit and it said where an error was.

I then relized that it didn't know what "replaceChild" belonged to. So i tried element there and it works fine now. Thanks for all your help =).

I hate IE too XD. Fx is the best.

**visualAd** · Feb 17th, 2008, 03:09 AM

I do apologise. I left the word element off by accident. Didn't even notice it

Thread: [RESOLVED] New to javascript but...

Thread Tools

Display

[RESOLVED] New to javascript but...

Re: New to java but...

Re: New to java but...

Re: New to javascript but...

Re: New to javascript but...

Re: New to javascript but...

Re: New to javascript but...

Re: New to javascript but...

Re: New to javascript but...

Re: New to javascript but...

Re: New to javascript but...

Re: New to javascript but...

Re: New to javascript but...

Re: New to javascript but...

Re: New to javascript but...

Re: New to javascript but...

Re: New to javascript but...

Re: [RESOLVED] New to javascript but...

Posting Permissions