Hello and welcome to our community! Is this your first visit?
Enjoy an ad free experience by logging in. Not a member yet? Register.

1. student project

I'm doing a correspondence course on javascript, but the terminology is giving me up-hill and after hour of battling, my Javascript was just a mess. could someone help me with the javascript function. My instruction reads:

"Create a web page with 5 text boxes. Assign to each text box's value attribute a value of zero. Add to each of the text boxes an onchange event handler that calls a function named calcAvg() and passes to the function the value of that text box by referencing it's document object, form name, and name and value attributes. Within the calcAvg() function, pass the five parameters to another function, named performCalc(), and assign the returned value to a variable named calcResult, then place the returned value in to another text box with a name averageResult. In the performCalc() function, calculate the average of the five numbers (by adding the five numbers and then dividing the total by 5), then return the result to the calcAvg() function. When you preform the calculation, use the parseInt() function to insure that the passes values are calculated as numbers."

Please assist be as kind as to assist me with this project so I can use it as reference to the following projects that follow on the foundation of this one...

My code so far;

Code:
```<!DOCTYPE html PUBLIC "-//W3C/DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Calculate average</title>
<script type="text/javascript">
/*<![CDATA[*/

/*]]<*/
</script>

<body>
<h1>Calculating averages</h1>

<table>
<tr>
<td>
<tr>
<td>Value 1<br/></td>
<td>
<input type="text" name="valueOne" size="6" value="0" onchange="calcAvg()" /></td>
</tr>
<tr>
<td>Value 2<br/></td>
<td>
<input type="text" name="valueTwo" size="6" value="0" onchange="calcAvg()" /></td>
</tr>
<tr>
<td>Value 3<br/></td>
<td>
<input type="text" name="valueThree" size="6" value="0" onchange="calcAvg()"/></td>
</tr>
<tr>
<td>Value 4<br/></td>
<td>
<input type="text" name="valuefour" size="6" value="0" onchange="calcAvg()"/></td>
</tr>
<tr>
<td>Value 5</td><br/>
<td>
<input type="text" name="valueFive" size="6" value="0" onchange="calcAvg()"/></td>
</tr>
</td>
</tr>
</table>

<form action="" name="averageResult" >
<p>The average of the 5 numbers:
<input type="text" name="cost" size="5" value="0"
style="border-style: none; border-color:inherit; border-width:medium; background-color: Transparent" text="0"/></p>
</form>

</body>
</html>```

• All you have done is generated a basic html page with absolutely no JavaScript code for us to assist you with. No one is going to write it all for you. I you would like to write up your own attempt at the requested JS code, then someone may be willing to help you fix your errors.

• Originally Posted by DanInMa
All you have done is generated a basic html page with absolutely no JavaScript code for us to assist you with. No one is going to write it all for you. I you would like to write up your own attempt at the requested JS code, then someone may be willing to help you fix your errors.

Yeah, thought as much, however I am unsure how to call the values entered in the HTML text boxes to the function.

my javascript looked something like this;
Code:
```function calcAvg(valueOne, valueTwo, valueThree, valueFour, valueFive) {
var calcResult = valueOne + valueTwo + valueThree + valueFour + valueFive;
var averageResult = calcResult / 5;
return averageResult;
}```
Even if i can get the above function to work, it still doen not follow the the guidelines set in the project, nor do I know how to print the result in the textbox
Code:
```<form action="" name="averageResult" >
<p>The average of the 5 numbers:
<input type="text" name="cost" size="5" value="0"
style="border-style: none; border-color:inherit; border-width:medium; background-color: Transparent" text="0"/></p>
</form>```
I assure you that it is out of tremendous frustration that I am requesting assistance as this is a correspondence course, and not at all that I want someone else to do the work...I don't understand the terminology of Javascript.

• You need to change the <form> tag in your page.

As it is, the ONLY field in your <form> is `<input type="text" name="cost" ...`

You really want *ALL* form fields on the page to be in ONE form.

Most of the time, you should simply put the <form> right after the <body> and the </form> just before the </body>.

Then the easy way to get the five required parameters (per the instructions) is this:
Code:
`<input type="text" name="valueThree" size="6" value="0" onchange="calcAvg(this)"/>`
The keyword this in JavaScript means "the current object", so you *ARE* passing the "reference to the form field" in this way.

From there, you can get references to "it's [sic] document object, form name, and name and value attributes." Though that is only 4 things, so I dunno what the fifth one is that you mention there.

Anyway:
Code:
```function calcAvg( field )
{
var form = field.form;
var formName = form.name; // but form names are obsolete!!!
var document = form.document;
var value = field.value;
var name = field.name;
...```
Maybe the fifth argument is just [b]field[/b}? Those instructions are far from crystal clear. (And most of those five values are completely redundant, too.)

The very fact that they want you to get the form name means that, to me, this is a very old textbook or very out of date instructor.

• Users who have thanked Old Pedant for this post:

staalkoppie (05-08-2012)

• Thanks a million! I am of the opinion that they needed to start of the course with basic HTML training first. It's correspondence course, so I wish I had a instructor . Well thanks again...let implement these changes

• Originally Posted by staalkoppie
. It's correspondence course, so I wish I had a instructor .
Do they offer a corrspondence swimming course as well?

•