NateM
03-16-2009, 12:01 AM
So, I've got a really stupid javascript question here. I have a simple calculation function, which I would like to separate as a javascript file from the main html file. While it works fine if it is embedded, I can't seem to get the function to be properly called if it is in a separate javascript file. Here is what I'm trying to do:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script language="JavaScript" src="script.js"></script>
</head>
<body>
<form name="myform">
<table border="0">
<tbody>
<tr>
<td>Variable</td>
<td>
<select name="variable" size="1">
<option value="select">Select</option>
<option value="2000">A</option>
<option value="4800">B</option>
</select>
</td>
</tr>
<tr>
<td>Input</td>
<td> <input name="total" type="text">
</td>
</tr>
<tr>
<td>Output</td>
<td> <input name="amount" readonly="true"
type="text"> </td>
</tr>
<tr>
<td> </td>
<td> <input value="Calculate"
onclick="doMath()" name="button" type="button">
</td>
</tr>
</tbody>
</table>
</form>
</body>
</html>
And here is the javascript function for script.js:
function doMath() {
var one = eval(myform.total.value)
var two = eval(myform.variable.value)
var tax = 0
var drop = 0
if (one > two){ tax = 0.05; drop = 0;}
if (one > (two + 500)){ tax = 0.1; drop = 25;}
if (one > (two + 2000)){ tax = 0.15; drop = 125;}
if (one > (two + 5000)){ tax = 0.20; drop = 375;}
if (one > (two + 20000)){ tax = 0.25; drop = 1375;}
if (one > (two + 40000)){ tax = 0.30; drop = 3375;}
if (one > (two + 60000)){ tax = 0.35; drop = 6375 ;}
if (one > (two + 80000)){ tax = 0.40; drop = 10375;}
if (one > (two + 100000)){ tax = 0.45; drop = 15375;}
var prod = ((one - two) * tax) - drop
myform.amount.value=custRound(prod,2);
}
function custRound(x,places) {
return (Math.round(x*Math.pow(10,places)))/Math.pow(10,places)
}
How do I get this called in properly? Any help would be appreciated.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script language="JavaScript" src="script.js"></script>
</head>
<body>
<form name="myform">
<table border="0">
<tbody>
<tr>
<td>Variable</td>
<td>
<select name="variable" size="1">
<option value="select">Select</option>
<option value="2000">A</option>
<option value="4800">B</option>
</select>
</td>
</tr>
<tr>
<td>Input</td>
<td> <input name="total" type="text">
</td>
</tr>
<tr>
<td>Output</td>
<td> <input name="amount" readonly="true"
type="text"> </td>
</tr>
<tr>
<td> </td>
<td> <input value="Calculate"
onclick="doMath()" name="button" type="button">
</td>
</tr>
</tbody>
</table>
</form>
</body>
</html>
And here is the javascript function for script.js:
function doMath() {
var one = eval(myform.total.value)
var two = eval(myform.variable.value)
var tax = 0
var drop = 0
if (one > two){ tax = 0.05; drop = 0;}
if (one > (two + 500)){ tax = 0.1; drop = 25;}
if (one > (two + 2000)){ tax = 0.15; drop = 125;}
if (one > (two + 5000)){ tax = 0.20; drop = 375;}
if (one > (two + 20000)){ tax = 0.25; drop = 1375;}
if (one > (two + 40000)){ tax = 0.30; drop = 3375;}
if (one > (two + 60000)){ tax = 0.35; drop = 6375 ;}
if (one > (two + 80000)){ tax = 0.40; drop = 10375;}
if (one > (two + 100000)){ tax = 0.45; drop = 15375;}
var prod = ((one - two) * tax) - drop
myform.amount.value=custRound(prod,2);
}
function custRound(x,places) {
return (Math.round(x*Math.pow(10,places)))/Math.pow(10,places)
}
How do I get this called in properly? Any help would be appreciated.