Should-Be-Simple JavaScript Calculator Gone Wrong!

@fxmOct 20.2004

I have created a Javascript calculator that figures cubic yards used for volume calculations. I have checked and double checked but am sure I am missing something simple (as this entire project should be simple to begin with) but to my dispair, the Calculate button doesn’t do the calculations. Could someone take the 5 minutes needed please and direct me as to why this isn’t working?

Here is the page:

~~[url]~~http://www.nexuscore.net/mjf/volumecalc.html[/url]

THANKS!

to post a comment

JavaScript

12 Comments(s) _↴

@Warren86Oct 20.2004 — #<html>

<head>
 
   <meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
   <title>Cubic Volume Calculations</title>
 
   <SCRIPT LANGUAGE="JavaScript">
 
   function calculate(isForm){
   WidthFt = parseFloat(isForm.WidthFt.value)
   WidthIn = parseFloat(isForm.WidthIn.value)
   HeightFt = parseFloat(isForm.HeightFt.value)
   HeightIn = parseFloat(isForm.HeightIn.value)
   DepthIn = parseFloat(isForm.DepthIn.value)
   ry=((WidthFt*12+WidthIn)*(HeightFt*12+HeightIn)*DepthIn/46656).toFixed(4);
   rf=((WidthFt*12+WidthIn)*(HeightFt*12+HeightIn)*DepthIn/27).toFixed(4)
   isForm.ResultsYds.value=ry;
   isForm.ResultsFeet.value=rf;
   isForm.WidthFt.focus();
   }
 
   </SCRIPT>
 
  </head>
 
  <body bgcolor="#ffffff">

<center>

<form name='yds3'>

<table border=3 cellspacing=2 cellpadding=5>

<tr>

<td align=center>Width: <input type="text" name="WidthFt" value="0" size="10" tabindex="1">ft.</td>

<td align=center>Width: <input type="text" name="WidthIn" value="0" size="10" tabindex="2">in.</td>

</tr>

<tr>

<td align=center>Height: <input type="text" name="HeightFt" value="0" size=10 tabindex="3">ft.</td>

<td align=center>Height: <input type="text" name="HeightIn" value="0" size=10 tabindex="4">in.</td>

</tr>

<tr>

<td colspan=2 align=center>Depth: <input type="text" name="DepthIn" value="0" size="5" tabindex="5">inches</td>

</tr>

<tr>

<td colspan="2" align=center><input type="button" value="Calculate" onclick="calculate(yds3)" tabindex="6"></td>

</tr>

<tr>

<td colspan="2" align=center>Results: <input type="text" name="ResultsYds" value="0" readonly size="10" tabindex="7">yd<sup>3</sup></td>

</tr>

<tr>

<td colspan="2" align=center>Results: <input type="text" name="ResultsFeet" value="0" readonly size="10" tabindex="8">ft<sup>3</sup></td>

</tr>

</table>

</form>

<Script> yds3.WidthFt.focus(); yds3.WidthFt.select()</Script>

</center>

</body>

</html>

@fxmauthorOct 20.2004 — #Although this response did clean up my code (thank you), results are still not being applied in to neither the ResultsYds nor ResultsFeet input texts. So, although my code may be more specific, the original problem still exists.

?

@Warren86Oct 20.2004 — #Well, you must have changed something from what I posted. I tested it, AS IS, and it works fine.

Try just copying and pasting the code I posted into NotePad and saving it as an HTML document.

Just to be sure, I did exactly as I just stated, and it works fine.

@fxmauthorOct 20.2004 — #Alright, I did that, and its up at:

http://www.nexuscore.net/mjf/vcalc.html

If that works for you, and anyone else, I have bigger problems then just my javascript competency. (Still no results here)

hmm...

@Warren86Oct 20.2004 — #I went to your link, and the calculator is working just fine. Do you have JavaScript enabled on your computer?

@Warren86Oct 20.2004 — #I used 3 for the value of each field. Results:

.0978 = yd3

169.0000 ft3

@fxmauthorOct 20.2004 — #This is starting to weird me out. Yeah I have javascript enabled, and if you getting tired of dealing with this issue, I understand, you have already done a lot to help. But if you have any other ideas why this isn't working on my screen (MacOSX10.3.5 with both Safari1.2.3 AND IE5.2mac edition, both javascript enabled) then I am all ears.

@Warren86Oct 20.2004 — #Try this:

<html>

<head>
 
   <meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
   <title>Cubic Volume Calculations</title>
 
   <SCRIPT LANGUAGE="JavaScript">
 
   function calculate(){
   WidthFt = parseFloat(document.forms.yds3.WidthFt.value)
   WidthIn = parseFloat(document.forms.yds3.WidthIn.value)
   HeightFt = parseFloat(document.forms.yds3.HeightFt.value)
   HeightIn = parseFloat(document.forms.yds3.HeightIn.value)
   DepthIn = parseFloat(document.forms.yds3.DepthIn.value)
   ry=((WidthFt*12+WidthIn)*(HeightFt*12+HeightIn)*DepthIn/46656).toFixed(4);
   rf=((WidthFt*12+WidthIn)*(HeightFt*12+HeightIn)*DepthIn/27).toFixed(4)
   document.forms.yds3.ResultsYds.value=ry;
   document.forms.yds3.ResultsFeet.value=rf;
   document.forms.yds3.WidthFt.focus();
   }
 
   </SCRIPT>
 
  </head>
 
  <body bgcolor="#ffffff">

<center>

<form name='yds3'>

<table border=3 cellspacing=2 cellpadding=5>

<tr>

<td align=center>Width: <input type="text" name="WidthFt" value="0" size="10" tabindex="1">ft.</td>

<td align=center>Width: <input type="text" name="WidthIn" value="0" size="10" tabindex="2">in.</td>

</tr>

<tr>

<td align=center>Height: <input type="text" name="HeightFt" value="0" size=10 tabindex="3">ft.</td>

<td align=center>Height: <input type="text" name="HeightIn" value="0" size=10 tabindex="4">in.</td>

</tr>

<tr>

<td colspan=2 align=center>Depth: <input type="text" name="DepthIn" value="0" size="5" tabindex="5">inches</td>

</tr>

<tr>

<td colspan="2" align=center><input type="button" value="Calculate" onclick="calculate()" tabindex="6"></td>

</tr>

<tr>

<td colspan="2" align=center>Results: <input type="text" name="ResultsYds" value="0" readonly size="10" tabindex="7">yd<sup>3</sup></td>

</tr>

<tr>

<td colspan="2" align=center>Results: <input type="text" name="ResultsFeet" value="0" readonly size="10" tabindex="8">ft<sup>3</sup></td>

</tr>

</table>

</form>

<Script> yds3.WidthFt.focus(); yds3.WidthFt.select()</Script>

</center>

</body>

</html>

@fxmauthorOct 20.2004 — #I still don't get a change at all in the results fields. The Calculate button is having no effect on my screen.

Just for convention, the newest one is here:

http://www.nexuscore.net/mjf/vc.html

Is there maybe a link or something besided the button I could try to activate the function?

I am just shooting in the dark now though.

@Warren86Oct 20.2004 — #Try the following. If you don't get the "Hello" alert when you click the button, then JavaScript is not enabled, and I give up. I have nothing further to offer. I went to the site in your most recent post, and again, it works fine.

<html>

<head>
 
   <meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
   <title>Cubic Volume Calculations</title>
 
   <SCRIPT LANGUAGE="JavaScript">
 
   function calculate(){
   alert('Hello');
   WidthFt = parseFloat(document.forms[0].WidthFt.value)
   WidthIn = parseFloat(document.forms[0].WidthIn.value)
   HeightFt = parseFloat(document.forms[0].HeightFt.value)
   HeightIn = parseFloat(document.forms[0].HeightIn.value)
   DepthIn = parseFloat(document.forms[0].DepthIn.value)
   ry=((WidthFt*12+WidthIn)*(HeightFt*12+HeightIn)*DepthIn/46656).toFixed(4);
   rf=((WidthFt*12+WidthIn)*(HeightFt*12+HeightIn)*DepthIn/27).toFixed(4)
   document.forms[0].ResultsYds.value=ry;
   document.forms[0].ResultsFeet.value=rf;
   document.forms[0].WidthFt.focus();
   }
 
   </SCRIPT>
 
  </head>
 
  <body bgcolor="#ffffff">

<center>

<form name='yds3'>

<table border=3 cellspacing=2 cellpadding=5>

<tr>

<td align=center>Width: <input type="text" name="WidthFt" value="0" size="10" tabindex="1">ft.</td>

<td align=center>Width: <input type="text" name="WidthIn" value="0" size="10" tabindex="2">in.</td>

</tr>

<tr>

<td align=center>Height: <input type="text" name="HeightFt" value="0" size=10 tabindex="3">ft.</td>

<td align=center>Height: <input type="text" name="HeightIn" value="0" size=10 tabindex="4">in.</td>

</tr>

<tr>

<td colspan=2 align=center>Depth: <input type="text" name="DepthIn" value="0" size="5" tabindex="5">inches</td>

</tr>

<tr>

<td colspan="2" align=center><input type="button" value="Calculate" onclick="calculate()" tabindex="6"></td>

</tr>

<tr>

<td colspan="2" align=center>Results: <input type="text" name="ResultsYds" value="0" readonly size="10" tabindex="7">yd<sup>3</sup></td>

</tr>

<tr>

<td colspan="2" align=center>Results: <input type="text" name="ResultsFeet" value="0" readonly size="10" tabindex="8">ft<sup>3</sup></td>

</tr>

</table>

</form>

<Script> yds3.WidthFt.focus(); yds3.WidthFt.select()</Script>

</center>

</body>

</html>

@fxmauthorOct 20.2004 — #Well, I appreciated your time, and efforts. The Hello box does appear, so javascript is enabled, and that button does do something. I will continue to look around, and in the mean time if any other ideas come to mind, I am still anxious to hear them.

@Warren86Oct 20.2004 — #You may want to upgrade your browser to at least IE5.5, but I know nothing of Mac. Otherwise, use alert to display the value of each line. Like so:

function calculate(){

alert(parseFloat(document.forms[0].WidthFt.value))

WidthIn = parseFloat(document.forms[0].WidthIn.value)

HeightFt = parseFloat(document.forms[0].HeightFt.value)

HeightIn = parseFloat(document.forms[0].HeightIn.value)

DepthIn = parseFloat(document.forms[0].DepthIn.value)

ry=((WidthFt*12+WidthIn)*(HeightFt*12+HeightIn)*

DepthIn/46656).toFixed(4);

rf=((WidthFt*12+WidthIn)*(HeightFt*12+HeightIn)*

DepthIn/27).toFixed(4)

document.forms[0].ResultsYds.value=ry;

document.forms[0].ResultsFeet.value=rf;

document.forms[0].WidthFt.focus();

}

and see what happens.

Also, instead of forms[0], try forms['yds3']

And, now, I have nothing further to offer, honestly.

Also in #JavaScript _↴

how to find start date and end date of current week Newbe in html need help in javascriptmenu editable and non editable input field and select

Success!

Help @fxm spread the word by sharing this article on Twitter...

Tweet This

Should-Be-Simple JavaScript Calculator Gone Wrong!

12 Comments(s) _↴

Also in #JavaScript _↴

Success!

Social

Version

Should-Be-Simple JavaScript Calculator Gone Wrong!

12 Comments(s) ↴

Also in #JavaScript ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

12 Comments(s) _↴

Also in #JavaScript _↴