Simple JavaScript calculator doesn't work in NetScape

[Judas1012]

I've got a simple JavaScript calculator in a form that works in Safari on Mac OS X and IE on Mac OS X and Windows machines -- the calculator doesn't work in any Netscape-derived browser, though... what am I doing wrong here?

<SCRIPT LANGUAGE="JavaScript" type="text/JavaScript">

<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->

<!-- Begin
function customPrice() {
var height = bannerorder.customHeight.value;
var length = bannerorder.customLength.value;
var cost = bannerorder.customCost.value;
var num = height * length * 2.65;

if ((height == 2 && length == 4) || (height == 4 && length == 2)) {
alert("2 x 4 is a predefined size. Please select it from the menu to the left.");
bannerorder.customHeight.value = "";
bannerorder.customLength.value = "";
bannerorder.customCost.value = "$0.00";
bannerorder.size.focus();
return false;
}

num = num.toString().replace(/\$|\,/g,'');
if(isNaN(num))
num = "0";
sign = (num == (num = Math.abs(num)));
num = Math.floor(num * 100 + 0.50000000001);
cents = num % 100;
num = Math.floor(num / 100).toString();
if(cents < 10)
cents = "0" + cents;
for (var i = 0; i < Math.floor((num.length - (1 + i)) / 3); i++)
num = num.substring(0,num.length - (4 * i + 3)) + ',' + num.substring(num.length-(4 * i + 3));
bannerorder.customCost.value = (((sign)?'':'-') + '$' + num + '.' + cents);
}
// End -->
</script>

"bannerorder" is the name of the form... here is how I call the method:

<table width="200" border="0" cellspacing="0" cellpadding="0">
<tr align="center" valign="middle">
<td><span class="style10">Height (ft.) </span></td>
<td><span class="style10">Length (ft.) </span></td>
</tr>
<tr align="center" valign="middle">
<td><input name="customHeight" type="text" id="customHeight" size="5" maxlength="3" onChange="customPrice()"></td>
<td><input name="customLength" type="text" id="customLength" size="5" maxlength="3" onChange="customPrice()"></td>
</tr>
</table>
<p>
<input name="CalcCost" type = button id="CalcCost" onClick="customPrice()" value="Calculate Cost">
</p>
<p><span class="style3"><strong>Cost of custom banner: </strong></span>
<br>
<input name="customCost" type="text" id="customCost" value="$0.00" size="10" maxlength="10" readonly>

Putting a semicolon at the end of "customPrice();" like that doesn't make a difference. Please help!

[khp]

What error message does Netscapes javascript console give you ?.

[Judas1012]

Hmmm... here are the errors it gives me:

Line 159: "e is not defined"
Line 178: "bannerorder is not defined"

Strange... guess I got some debugging to do. Why doesn't it recognize "bannerorder?" That's the name of the form.

[Judas1012]

Ok, I figured out the "e is not defined" problem -- it stems from a JavaScript I have that disables the ability to send the form with the Enter key. I just removed that JavaScript because the submission action checks the form for required data before it sends.

Now I'm just down to figuring out why it says that "bannerorder" is not defined. I tried passing the form to the function like "customPrice(this)" and "customPrice(this.bannerorder)" and modified the function to be "customPrice(theForm)" and replaced all "bannerorder" occurrences in the function with "theForm" but it still doesn't work.

I can't figure it out.

[khp]

Originally posted by Judas1012
Why doesn't it recognize "bannerorder?" That's the name of the form.

Named html elements, are not automatically declared as variables in javascript. I guess IE and others, have implemented a hack that means that named forms are declared as variables automatically. To do it in Netscape you could make a decleration like this
var bannerorder = document.forms.bannerorder;

[Judas1012]

Works perfectly now. Thank you very much! As a newbie to JavaScript, I don't know all the little format and variable differences between browsers. Thank you again!