Help with a very basic javascript/html web calculator program?

Goomba000 · 10-07-2009, 11:50 PM

I don't get why it doesn't work. Here's the code:
<HTML>

<HEAD>

<TITLE> Lab no. 3 Cole Stevens </TITLE>

<script language="Javascript">

function calculate(form)

{

var answer = eval(form.valueA.value);

form.valueB.value= answer;

}

function clearbox(form)

{

form.valueA.value="";

form.valueB.value="";

}

</SCRIPT>

<BODY>

<FORM NAME="math">

<P> Mathematical expression: <INPUT TYPE="text" NAME="valueA" SIZE="20">

<P> Answer: <INPUT TYPE="text" NAME="valueB" SIZE="20">

<P> <INPUT TYPE="button" VALUE="Calculate!" NAME="calculate" onClick="calculate(this.form)">

<P> <INPUT TYPE="button" VALUE="Clear" NAME="clear" onClick="clearbox(this.form)">

</BODY>

Any and all help is greatly appreciated. Thanks!

**jamiemac2005** · 10-12-2009, 04:45 AM

Hey it took me a few to work out what the problem was. But basically you're using the same names all over the place, so when you call "calculate(this.form)" the browser thinks you're referring to the form object (which is the button that calls calculate).

Fix(note the bold):

Code:

<INPUT TYPE="button" VALUE="Calculate" NAME="calc" onClick="calculate(this.form)">

Also you need to close your <head> tag, it wont pose a problem yet but at some point it might.

Cheers,
Jamey

10-07-2009, 11:50 PM	#1 (permalink)
Goomba000 Registered User Join Date: Jan 2008 Location: Hawaii Posts: 81 OS: Vista, Ubuntu	Help with a very basic javascript/html web calculator program? I don't get why it doesn't work. Here's the code: <HTML> <HEAD> <TITLE> Lab no. 3 Cole Stevens </TITLE> <script language="Javascript"> function calculate(form) { var answer = eval(form.valueA.value); form.valueB.value= answer; } function clearbox(form) { form.valueA.value=""; form.valueB.value=""; } </SCRIPT> <BODY> <FORM NAME="math"> <P> Mathematical expression: <INPUT TYPE="text" NAME="valueA" SIZE="20"> <P> Answer: <INPUT TYPE="text" NAME="valueB" SIZE="20"> <P> <INPUT TYPE="button" VALUE="Calculate!" NAME="calculate" onClick="calculate(this.form)"> <P> <INPUT TYPE="button" VALUE="Clear" NAME="clear" onClick="clearbox(this.form)"> </BODY> Any and all help is greatly appreciated. Thanks!

10-12-2009, 04:45 AM	#2 (permalink)
jamiemac2005 Design Team Member Join Date: Jul 2007 Location: Coventry, UK Posts: 1,864 OS: Vista, various linux distros	Re: Help with a very basic javascript/html web calculator program? Hey it took me a few to work out what the problem was. But basically you're using the same names all over the place, so when you call "calculate(this.form)" the browser thinks you're referring to the form object (which is the button that calls calculate). Fix(note the bold): Code: <INPUT TYPE="button" VALUE="Calculate" NAME="calc" onClick="calculate(this.form)"> Also you need to close your <head> tag, it wont pose a problem yet but at some point it might. Cheers, Jamey __________________ Myspace